1. 程式人生 > >JQuery元素屬性和樣式操作、以及設置元素和內容

JQuery元素屬性和樣式操作、以及設置元素和內容

ava 例如 term wid 集合 遍歷 內容 ssd each

一、JQury元素屬性操作
通過JQuery可以對元素本身的屬性進行操作,包括獲取屬性的屬性值,設置屬性的屬性值,並且可以刪除屬性值(attr()和removeAttr())。
二、JQuery樣式操作
元素樣式操作包括了:直接設置css樣式、增加css樣式、類別切換、刪除類別。
例如:
$(‘div‘).css(‘color‘);//獲取元素行內的css樣式顏色。
$(‘div‘).css(‘color‘. ‘pink‘);//設置我最喜歡的粉色。
var box = $(‘div‘).css([‘color‘,‘height‘,‘width‘]);//這裏得到的是一個對象數組。
順便講一下數組的遍歷:兩種方法
第一種
for(var i in box){
box[i];
}
第二種
$.each(box,function(attr,value){//遍歷JavaScript原生態對象
attr+":"+value;
})
為某div定義多個樣式:
技術分享圖片
div樣式點擊切換:
技術分享圖片
三、JQuery DOM簡介
在JQuery中,已經將最常用的DOM操作方法進行的封裝(不需要考慮,瀏覽器的兼容性)。
D表示頁面文檔的Document
O表示對象,即一組含有獨立特性的數據集合
M表示模型,即頁面上的元素節點和文本節點。
DOM有三種形式,標準DOM、HTMLDOM、CSSDOM,此刻並不需要深刻理解它。
樹形結構用來表示DOM,就非常貼切。大部分操作都是元素節點操作,還有少部分文本節點操作。
四、設置元素內容
技術分享圖片
技術分享圖片

JQuery元素屬性和樣式操作、以及設置元素和內容