javascript怎么改变字体大小(2)-木庄网络博客

然后，就要通过点击加减按钮来控制文字的大小了，js代码如下：

<script>
    window.onload= function(){
        var oPtxt=document.getElementById("p1");
        var oBtn1=document.getElementById("Btn1");
        var oBtn2=document.getElementById("Btn2");
        var num = 14; /*定义一个初始变量*/
        oBtn1.onclick = function(){
            num++;
            oPtxt.style.fontSize=num+'px';
        };
        oBtn2.onclick = function(){
            num--;
            oPtxt.style.fontSize=num+'px';
        }
    }
</script>

点击“+”按钮一下，那么文字就会增加一像素，一直点击便会一直变大：

点击“-”按钮一下，那么文字就会减小一像素，一直点击便会一直变小：

就是这么的简单，一定要注意定义初始变量的时候，一定要是全局变量，而你需要操作按钮才使文字有变化的话，那么变量的增加和减小就一定是局部变量。

【相关推荐：javascript学习教程】

说明：HTML DOM Style fontSize 属性

fontSize属性设置或返回文本的字体大小。

语法：

返回fontSize属性：

1	`object.style.fontSize`

设置fontSize属性：

1	`object.style.fontSize =` `"value"`

属性值：

值	描述
xx-small x-small small medium large x-large xx-large	将字体大小设置为不同的固定大小，从xx-small到xx-large
smaller	将字体大小减少一个相对单位
larger	将字体大小增加一个相对单位
length	以长度单位定义字体大小
%	将font-size设置为父元素字体大小的％