javascript怎麼改變字體大小

在javascript中，可以使用Style物件的fontSize屬性來改變字體大小，該屬性可以設定文字的字體大小，語法格式「元素物件.style.fontSize="值"」。

本教學操作環境：windows7系統、javascript1.8.5版、Dell G3電腦。

在javascript中，可以使用Style物件的fontSize屬性來改變字體大小。

下面我們透過範例來看看fontSize屬性是怎麼改變字體大小的。

首先還是先看佈局，簡單寫一句話，並寫兩個按鈕：

<input id="Btn1" type="button" value="+" name=""/>
<input id="Btn2" type="button" value="-" name=""/>
<p id="p1" style="font-size:14px;">这是一些文字这是一些文字这是一些文字这是一些文字</p>

效果圖如下：

然後，就要透過點擊加減按鈕來控製文字的大小了，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+&#39;px&#39;;
        };
        oBtn2.onclick = function(){
            num--;
            oPtxt.style.fontSize=num+&#39;px&#39;;
        }
    }
</script>

點擊「 」按鈕一下，那麼文字就會增加一像素，一直點擊便會一直變大：

點選「-」按鈕一下，那麼文字就會減少一像素，一直點選就會一直變小：

 

#就是這麼的簡單，一定要注意定義初始變數的時候，一定要是全域變量，而你需要操作按鈕才使文字有變化的話，那麼變數的增加和減少就一定是局部變數。

【相關推薦：javascript學習教學】

#說明：HTML DOM Style fontSize 屬性

#fontSize屬性設定或傳回文字的字體大小。

語法：

• 傳回fontSize屬性：

#

object.style.fontSize

• 設定fontSize屬性：

object.style.fontSize = "value"

屬性值：

##larger將字體大小增加一個相對單位length以長度單位定義字體大小%將font-size設定為父元素字體大小的％

值	#描述
xx-small #x-small small medium large x-large xx-large	#將字體大小設定為不同的固定大小，從xx-small到xx-large
smaller	將字體大小減少一個相對單位

更多程式相關知識，請造訪：

程式設計影片！ ！

以上是javascript怎麼改變字體大小的詳細內容。更多資訊請關注PHP中文網其他相關文章！