1. 程式人生 > >給元素標籤設定樣式方法

給元素標籤設定樣式方法

例如給id為Div的元素的高度設定為200px;

原生js設定方法:

var Div = document.getElementById("Div")

方法一:Div.style.height = "200px";

方法二:Div.style["height"] = "200px";

方法三:Div.style.cssText = "height:200px";(可設定多個樣式)

方法四:Div.setAttribute("class","height");(通過新增名為height的class屬性簡介為標籤新增樣式,可新增多個樣式,若標籤已存在clss屬性,這樣會改變class屬性值)

總結:主要使用js的style屬性


jQuery方法:

方法一:$("#Div").css({"height":"200px"});(可新增多個樣式)

方法二:$("#Div").addClass("height");(通過新增名為height的class屬性簡介為標籤新增樣式,可新增多個樣式)

方法三:$("#Div").attr("class","height");(通過新增名為height的class屬性簡介為標籤新增樣式,可新增多個樣式。此外該方法還可以用於返回被選元素的屬性值)

總結:相對於原生js,jquery獲取元素物件更簡單。

在實際寫程式碼的過程中,總是把js原生的屬性和方法與jQuery的屬性和方法弄混,很多時候想到某個方法但又不確定是原生的還是jQuery的,總是要去查一下才行,效率很低,所以有必要總結一下。