jquery中attr 方法介紹和用法

2021-06-27 10:54:17 字數 1930 閱讀 3772

在js中設定節點的屬性與屬性值用到setattribute(),獲得節點的屬性與屬性值用到getattribute(),而在jquery中,用乙個attr()就可以全部搞定了,贊乙個先 ^^

jquery中用attr()方法來獲取和設定元素屬性,attr是attribute(屬性)的縮寫,在jquery dom操作中會經常用到attr(),attr()有4個表示式。

1.attr(屬性名

)

//獲取屬性的值(

取得第乙個匹配元素的屬性值。通過這個方法可以方便地從第乙個匹配元素中獲取乙個屬性的值。如果元素沒有相應屬性,則返回 undefined )

2.attr(屬性名, 屬性值)

//設定屬性的值 (

為所有匹配的元素設定乙個屬性值。)

3.attr(屬性名

,函式值)

//設定屬性的函式值  (

為所有匹配的元素設定乙個計算的屬性值。不提供值,而是提供乙個函式,由這個函式計算的值作為屬性值。

)4.attr(properties)

//給指定元素設定多個屬性值,即:

。(這是一種在所有匹配元素中批量設定很多屬性的最佳方式。 注意,如果你要設定物件的class

屬性,你必須使用

'classname' 

作為屬性名。或者你可以直接使用

'class'

或者'id'

。)

html**結構:

你最喜歡的水果是?

1.attr(name)//獲取屬性的值

1.1 使用attr(name)獲取title值:

結果:橘子汁

1.2 使用attr(name)獲取value值:

結果:123

2. attr(name,value) 

//設定屬性的值

2.1 使用attr(name,value)修改title值為:不吃橘子

結果:不吃橘子

3. attr(name,fn)  //設定屬性的函式值

3.1 把value屬性的值設定設給title屬性。

結果:123

4.attr(properties)  //將乙個「名/值」形式的物件設定為所有匹配元素的屬性

4.1 獲取裡第2個設定title和value屬性。

結果:不喝橘子汁  不是123

4.2 獲取裡第2個設定class。

結果:第二個li的html:橘子

4.3 獲取裡第2個設定id。

結果:第二個li的html:

橘子4.4 獲取裡第2個設定style。

那麼怎麼刪除屬性呢?

就這麼簡單

, attr 

其實就是原生

js中 

getattribute 

的簡化實現, 而

removeattr 

就是 removeattribute 

的簡寫了。

jquery中的attr 方法

jquery中用attr 方法來獲取和設定元素屬性,attr是attribute 屬性 的縮寫,在jquery dom操作中會經常用到attr attr 有4個表示式。1.attr 屬性名 獲取屬性的值 取得第乙個匹配元素的屬性值。通過這個方法可以方便地從第乙個匹配元素中獲取乙個屬性的值。如果元素沒...

jQuery中prop方法和attr方法的區別

舊版本的jqury用attr方法來設定或者獲取元素的屬性,但是存在bug,所以新版本在此基礎上推出了prop方法,現在推薦使用prop這個方法來幹這個事情。jquery在1.6以上的版本新增了乙個prop方法,這個方法和attr的作用很像,但各司其責。以上的版本用 selector prop che...

jquery屬性操作 attr 方法

attr 方法設定或返回被選元素的屬性值。根據該方法不同的引數,其工作方式也有所差異。返回被選元素的屬性值。selector attr attribute 引數 描述attribute 規定要獲取其值的屬性。檢視影象寬度 效果圖 設定被選元素的屬性和值。selector attr attribute...