淺談attr()和prop()

attr()和prop()這兩個屬性的時候感覺很迷茫，而且配合官方給出的推薦使用圖：

prop()可以做到的attr()完全都可以，而且做不到的attr()也可以做到。何用？  然后我就把它丟掉了。。。直到。。

 

今天切一個頁面，在checkbox判斷的方面上除了問題，就是通過jquery設置選中的時候，發現checked和disabled屬性已經設置上去了，而且一旦手動點掉checked或者選中的時候，就無法再次做判斷

if($('#d1').attr('disabled')!='disabled'){
        alert('1')
}

如果本身是存在disabled的時候，alert無法觸發，本身沒有disabled屬性的時候才能觸發，

if($('#d1').prop('disabled')!='disabled'){
        alert('1')
}

但是把attr()改成prop()的時候alert()就可以觸發了。

 還有

通過jquery的attr屬性修改選中狀態。我們神奇的發現，選中的狀態已經變了，但是樣式卻沒有變過來。

$("#reply1").attr("checked", true);

有些同學可能要說了，上面的代碼有問題。應該是 $("#reply1").attr("checked", “checked”);

然而我們發現這並沒有什么卵用。。。。於是乎我徹底凌亂了，難道是自己的問題還是自己的問題？

於是，我開始了2小時的大腦爆炸！腦子一直處於懵逼狀態，最終發現，之前被我遺棄的prop()是可以

觸發的。所以我得出結論---JQuery本身的問題。

所以在這里告訴大家，不是我們的錯，是jquery的問題！！！

 

那么現在我們來重新復習一遍prop();

prop()  ---  JQuery 1.6版本新增屬性，包含四種用法：

1,JQueryObject.prop(object);

返回屬性的值

2,JQueryObject.prop(propertyName,value);

設置屬性和值

3,JQueryObject.prop(property,function(index,currentvalue));

使用函數設置屬性和值

4,,JQueryObject.prop(property:value,property:value,....);

設置多個屬性和值

 

注意：

　　1.當該方法用於返回屬性值時，則返回第一個匹配元素的值

　　2.當該方法用於設置屬性值時，則為匹配元素集合設置一個或多個屬性/值對。

prop()方法多用於檢索屬性值，例如（DOM屬性,selectedIndex, tagName, nodeName, nodeType, ownerDocument, 

defaultChecked, 和 defaultSelected）;

但是檢索HTML屬性的時候，要使用attr()代替。

相對而言，移除屬性使用相對的removeAttr()和removeProp()兩種方法。