小编查阅了相关文章，为大家整理了几个小案例，供大家参考，具体内容如下
效果图：
点击大、小按钮，随时切换字体大小
具体代码：
使用js如果改变一篇文章字体的大小 脚本之家
脚本之家欢迎您好好学习 天天向上
大 小
再为大家分享一栗子：
这个工作原理很简单，就是在触发事件的时候将文章的字号改变，更直白一些就是改变font-size这个属性的值（jquery版本1.7.2）
html
放大 缩小 默认
这里是一些文字
css
.box{text-align:center;}.ctrl{padding:50px 0px 0px 0px;background:#f4f4f4;font-size:0px;border-bottom:3px solid #333;}.ctrl a{display:inline-block;width:50px;height:30px;line-height:30px;background:#333;color:#fff;font-size:14px;}.ctrl a:hover{background:#444;color:#fff;font-weight:700;text-decoration:none;}.cont{padding-top:50px;font-size:14px;}
js
$(function(){ function sizein(){ var sizecont = parseint($(.cont).css(fontsize)); // 获取原设定的font-size的值 if(sizecont == 30){ // 判断font-size增大到30像素时停止 $(.cont).css({fontsize:sizecont}); }else{ $(.cont).css({fontsize:sizecont + 1}); } } function sizeout(){ var sizecont = parseint($(.cont).css(fontsize)); if(sizecont == 10){ // 判断font-size减小到10像素时停止 $(.cont).css({fontsize:sizecont}); }else{ $(.cont).css({fontsize:sizecont - 1}); } } function sizedefault(){ $(.cont).css({fontsize:}) } $(.ctrl a).click(function(){ if($(this).index() == 0){ sizein(); }else if($(this).index() == 1){ sizeout(); }else{ sizedefault(); } })});
希望本文所述对大家学习javascript程序设计有所帮助。