本文主要是attr 是從頁面搜尋取得元素值，所以頁面必須明確定義元素才能取得值，相對來說比較慢。
如:
<input name='test' type='checkbox'> $('input:checkbox').attr('type'); 返回checkbox. $('input:checkbox').attr('checked'); 返回undefined。
因為<input name='test' type='checkbox'>中沒有checked關鍵字。
prop是從屬性物件中取值，屬性物件中有多少屬性，就能取得多少值，不需要在頁面中顯示定義。
例如
$('input:checkbox').prop('checked'); 返回false 。
這裡就會遇到個問題：如果是自訂的屬性，那麼屬性物件中是沒有這個屬性的。所以prop回傳undefined。但是頁面中可以檢索到這個屬性，所以attr是可以取得的。
attr取得的是初始化值，除非透過attr(‘name’,’value’)改變，否則值不變。 prop屬性值是動態的，例如checkbox，選取後，checked變成true，prop值也會改變。
所以有個經驗是：
#對於HTML元素本身就帶有固有的屬性，在處理時，使用prop方法。快速，準確。
對於HTML元素我們自己自訂的DOM屬性，在處理時，使用attr方法。
上面的描述也許有點模糊，舉幾個例子就知道了。
<a id="first" href="#" target="_self">超链接</a>
這個例子裡<a>元素的DOM屬性有id、href、target，這些屬性是<a>元素本身就有的屬性，W3C標準裡就包含這幾個屬性，或者說在IDE裡能夠智慧提示出的屬性，這些就叫做固有屬性。處理這些屬性時，建議使用prop。
<a id="first" href="#" target="_self" uuu="guoguo">超链接</a>
這個例子裡<a>元素的DOM屬性有id、href、target、uuu，前三個是固有屬性，最後一個「uuu」屬性使我們自訂的，<a>元素本身是沒有這個屬性的，這種就是自訂的DOM屬性。處理這些屬性時，建議使用attr。
<a href="#" target="_self">超链接</a>
//attr和prop都读取成功
//attr("href")的值是：#//prop("href")的值是：http://localhost:4590/AttributeHandle/Index#alert($("a").attr("href"));alert($("a").prop("href"));不同HTML標籤的固有屬性不完全相同，例如：checked屬性是checkbox標籤的固有屬性，但不是a標籤的固有屬性。 class屬性雖然是a標籤的固有屬性，但如果元素中沒有對該屬性賦值，用attr()也是讀取不到的。
<a href="#" target="_self">超链接</a>
<input type="checkbox" id="testCheckBox" value="测试CheckBox"/>
alert($("a").attr("id"));//输出：undefine
alert($("a").prop("id"));//输出：默认值""alert($("a").attr("checked"));//输出：undefine
alert($("a").prop("checked"));//输出：undefine
alert($("#testCheckBox").attr("checked"));//输出：undefine
alert($("#testCheckBox").prop("checked"));//输出：默认值falsealert($("a").attr("class"));//输出：undefine
alert($("a").prop("class"));//输出：默认值""<a href="#" target="_self" uuu="guoguo">超链接</a>
alert($("a").attr("uuu"));//输出：guoguoalert($("a").prop("uuu"));//输出：undefine<a href="#" target="_self" uuu="guoguo">超链接</a>
alert($("a").attr("abc"));//输出：undefinealert($("a").prop("abc"));//输出：undefine<a href="#" target="_self" uuu="guoguo">超链接</a>
$("a").attr("id","link");//id属性添加成功$("a").prop("id","link");//id属性添加成功<a href="#" target="_self" uuu="guoguo">超链接</a>$("a").attr("abc", "myself");//成功添加属性abc="myself"$("a").prop("abc", "myself");//添加abc属性失败$("a").attr("action", "addAttribute");//成功添加属性action="addAttribute"$("a").prop("action", "addAttribute");//添加action属性失败prop读取属性值：读取已赋值的固有属性会得到属性值，读取未赋值的固有属性会得到属性默认值，读取自定义属性时无论是否赋值均得到undefine。
prop设置属性值：prop只能设置固有属性值。
attr读取属性值：无论是固有属性还是自定义属性，attr只能读取元素中已有的属性值，读取元素中没有的属性值会返回undefine。
attr设置属性值：attr可以对任意属性设置属性值。
以上是js中prop和attr區別詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章！
