javascript增加樣式的方法：1、通過(guò)“document.getElementById("box");”方式；2、通過(guò)“head.style.cssText="…"”方法；3、使用setProperty方法。

本文操作環(huán)境：windows7系統(tǒng)、javascript1.8.5版、Dell G3電腦。

javascript怎么增加樣式？

js添加css樣式

下面舉一個(gè)簡(jiǎn)單案例：<div id="box"></div> 我們要為這個(gè)id為 box 的div添加樣式。我們要為它添加寬度、高度、背景色。

方法一：

var head= document.getElementById("box"); //獲取到id為box的div標(biāo)簽元素。 head.style.width = "70px"; //設(shè)置寬度為70 head.style.height = "70px";//設(shè)置高度為70 head.style.display = "#ccc";//設(shè)置背景色為灰色

這種方法比較簡(jiǎn)單，但是，如果CSS樣式很多的話(huà)，如還有margin、padding、font-size等，這時(shí)，我們還這樣寫(xiě)的話(huà)，那會(huì)一大堆。這時(shí)，我們可以用方法二。

方法二：

var head= document.getElementById("box");//獲取到id為box的div標(biāo)簽元素。 head.style.cssText="width:70px;height:70px;display:#ccc";

這種方法中，我們用到了“ cssText”，這樣我們就大大地減少了代碼。就像寫(xiě)CSS源文件里一樣。

方法三：使用setProperty

element.style.setProperty('height', '300px', 'important');

如果要設(shè)置!important，推薦用這種方法設(shè)置第三個(gè)參數(shù)

推薦學(xué)習(xí)：《javascript高級(jí)教程》