.attr() : 獲取匹配的元素集合中的第一個元素的屬性的值 或 設置每一個匹配元素的一個或多個屬性。 •.attr( attributeName ) •.attr( attributeName )
•.attr( attributeName, value ) •.attr( attributeName, value )
•.attr( attributes )
•.attr( attributeName, function(index, attr) )
.prop() : 獲取匹配的元素集中第一個元素的屬性(property)值或設置每一個匹配元素的一個或多個屬性。 •.prop( propertyName ) •.prop( propertyName )
•.prop( propertyName, value ) •.prop( propertyName, value )
•.prop( properties )
•.prop( propertyName, function(index, oldPropertyValue) )
是參數有區別,attr()傳入的是attributeName,而prop()傳入的是propertyName,
Attributes vs. Properties
在這裏,我們可以將attribute理解爲“特性”,property理解爲爲“屬性”從而來區分倆者的差異。
如果把DOM元素看成是一個普通的Object對象,這個對象在其定義時就具有一些屬性(property),比如把select的option當做一個對象:
var option = {
selected:false,
disabled:false,
attributes:[],
...
}
現在,我們一目瞭然了,attribute是一個特性節點,每個DOM元素都有一個對應的attributes屬性來存放所有的attribute節點,它是一個類數組的容器。attributes的每個數字索引以名值對(name=”value”)的形式存放了一個attribute節點。而property就是一個屬性,是一個以名值對(name=”value”)的形式存放在Object中的屬性。
jquery中attr和prop的區別介紹:
•對於HTML元素本身就帶有的固有屬性,在處理時,使用prop方法。
•對於HTML元素我們自己自定義的DOM屬性,在處理時,使用attr方法。
列子1:
<a href="http://www.baidu.com" target="_self" class="btn">百度</a>
這個例子裏<a>元素的DOM屬性有“href、target和class",這些屬性就是<a>元素本身就帶有的屬性,也是W3C標準裏就包含有這幾個屬性,或者說在IDE裏能夠智能提示出的屬性,這些就叫做固有屬性。處理這些屬性時,建議使用prop方法。
<a href="#" id="link1" action="delete">刪除</a>
這個例子裏<a>元素的DOM屬性有“href、id和action”,很明顯,前兩個是固有屬性,而後面一個“action”屬性是我們自己自定義上去的,<a>元素本身是沒有這個屬性的。這種就是自定義的DOM屬性。處理這些屬性時,建議使用attr方法。