javascript增加樣式的方法:1、通過“document.getElementById("box");”方式;2、通過“head.style.cssText="…"”方法;3、使用setProperty方法。
本文操作環(huán)境:windows7系統(tǒng)、javascript1.8.5版、Dell G3電腦。
javascript怎么增加樣式?
js添加css樣式
下面舉一個簡單案例:<div id="box"></div> 我們要為這個id為 box 的div添加樣式。我們要為它添加寬度、高度、背景色。
方法一:
var head= document.getElementById("box"); //獲取到id為box的div標簽元素。 head.style.width = "70px"; //設置寬度為70 head.style.height = "70px";//設置高度為70 head.style.display = "#ccc";//設置背景色為灰色
這種方法比較簡單,但是,如果CSS樣式很多的話,如還有margin、padding、font-size等,這時,我們還這樣寫的話,那會一大堆。這時,我們可以用方法二。
方法二:
var head= document.getElementById("box");//獲取到id為box的div標簽元素。 head.style.cssText="width:70px;height:70px;display:#ccc";
這種方法中,我們用到了“ cssText”,這樣我們就大大地減少了代碼。就像寫CSS源文件里一樣。
方法三:使用setProperty
element.style.setProperty('height', '300px', 'important');
如果要設置!important,推薦用這種方法設置第三個參數(shù)
推薦學習:《javascript高級教程》