先提出問題：對于 checked 這類值是 true/false 的屬性，用 jQuery 的 attr 或 prop 方法進行 讀取或設置值是有區別的。

在看 jQuery 文檔前，我們先看看 attribute 與 property 是什么：

先搞懂 attribute 與 property

當編寫 HTML 源碼時，你能在 HTML 元素里定義 attributes。然后，一旦瀏覽器解析你的代碼，該 HTML 元素相應的 DOM 節點就會被創建。該節點是一個對象，因此它就擁有 properties。因此，我們知道：attributes 是 HTML 元素（標簽）的屬性，而 properties 是 DOM 對象的屬性。

例如，下面這個 HTML 元素：

擁有兩個 attributes。

一旦瀏覽器解析該代碼，HTMLInputElement 對象就會被創建，并且該對象會擁有很多

peoperties，如：accept、accessKey、align、alt、attributes、autofocus、baseURI、checked、childElementCount、ChildNodes、children、classList、className、clientHeight

等等。

對于某個 DOM 節點對象，properties 是該對象的所有屬性，而 attributes 是該對象對應元素(標簽)的屬性。

當一個 DOM 節點為某個 HTML 元素所創建時，其大多數 properties 與對應 attributes 擁有相同或相近的名字，但這并不是一對一的關系。例如，下面這個 HTML 元素

其對應 DM 節點會擁有如下properties： id、type 和 value：

idproperty是idattribute 的映射：獲取該 property 即等于讀取其對應的 attribute 值，而設置該 property 即為 attribute 賦值。id是一個純粹的映射 property，它不會修改或限制其值。

typeproperty 是typeattribute 的映射：獲取該 property 即等于讀取其對應的 attribute 值，而設置該 property 即為 attribute 賦值。但type并不是一個純粹的映射 property，因為它的值被限制在已知值（即 input 的合法類型，如：text、password）。如果你有，然后theInput.getAttribute("type")會返回"foo"，而theInput.type會返回"text"。

相比之下，valueproperty 并不會映射valueattribute。取而代之的是 input 的當前值。當用戶手動更改輸入框的值，valueproperty 會反映該改變。所以，如果用戶在 input 輸入John，然后：

theInput.value // 返回 "John"

然而：

theInput.getAttribute('value') // 返回 "Name:"

valueproperty 反映了 input 的當前文本內容，而valueattribute 則是在 HTML 源碼 value 屬性所指定的初始文本內容。

因此，如果你想知道文本框的當前值，則讀取 property。而如果你想知道文本框的初始值，則讀取 attribute。或者你也可以利用 defaultValue property，它是 value attribute 的純粹映射。

theInput.value// returns "John"theInput.getAttribute('value')// returns "Name:"theInput.defaultValue// returns "Name:"

有幾個 properties 是直接反映它們 attribute（rel、id），而有一些則用稍微不同的名字進行直接映射（htmlFor映射forattribute，className映射classattribute）。很多 property 所映射的 attribute 是帶有限制/變動的（src、href、disabled、multiple）。該規范涵蓋了各種各樣的映射。

再看看 attr() 與 prop() 的區別

上述能讓我們理清了 attribute 與 property 之間的區別，下面根據jQuery 文檔對 attr() 與 prop() 方法進行比較：

自 jQuery 1.6 版本起，attr()方法對于未設置的 attributes （即標簽中沒寫該 attributes）都會返回undefined。對于檢索和改變 DOM 的 properties，如表單元素的 checked、selected 或 disabled 狀態，應使用.prop()方法。

Attributes vs. Properties

attributes 與 properties 之間的差異在特定情況下會變得尤為重要。在 jQuery 1.6 前，.attr()方法在檢索一些 attributes 時，有時會把 property 考慮進去，這會導致不一致的行為。在 jQuery 1.6 版本之后，.prop()方法提供了一種明確檢索 property 值的方式，而.attr只會檢索 attributes。

例如，selectedIndex、tagName、nodeName、nodeType、ownerDocument、defaultChecked 和 defaultSelected 能被.prop()檢索與設置。在 jQuery 1.6 之前，這些 properties 都是通過.attr()檢索的，但檢索這些屬性并不應屬于 attr 方法職責內 。這些屬性并沒有對應的 attributes，只有 properties 本身。

對于值為布爾值的 attributes ，考慮到一個 DOM 元素是通過 HTML 標簽

讀取屬性返回值描述

elem.checkedtrue (Boolean)會隨著 checkbox 狀態作出相應改變

$(elem).prop("checked")true (Boolean)會隨著 checkbox 狀態作出相應改變

elem.getAttribute("checked")"checked" (String)checkbox 的初始狀態；并且不會隨著 checkbox 的狀態而改變。

$(elem).attr("checked") (1.6)"checked" (String)checkbox 的初始狀態；并且不會隨著 checkbox 的狀態而改變。

$(elem).attr("checked") (1.6.1+)"checked" (String)會隨著 checkbox 狀態而作出相應改變（與jQuery文檔描述不一樣，我用jQuery 1.12.1 測試，都是返回 “checked”，并不會隨著checkbox的改變而改變）。

$(elem).attr("checked") (1.6之前版本)true (Boolean)true (Boolean) 會隨著 checkbox 狀態作出相應改變。

根據 W3C forms（表單） 規范，checked是一個值為 boolean 的 attribute，這意味著當該 attribute 存在（無論值是什么），其對應的 property 都是 true。例如，該 attribute 沒賦值或設為空字符串，甚至設為"false"。這同樣適用于所有值為 boolean 的 attributes。

然而，對于checkedattribute 最重要的概念是記住它并不是對應checkedproperty。該 attribute 實際上是對應defaultCheckedproperty，并僅在初次設置 checkbox 值時使用。checkedattribute 的值并不會隨著 checkbox 的狀態而作出相應改變，而checkedproperty 會。因此，為了兼容不同瀏覽器，當判斷一個 checkbox 是否被選擇時應該使用property：

if(elem.checked)if($(elem).prop("checked"))if($(elem).is(":checked"))

這同樣適用于其它動態 attributes，如 selected 和 value。

其他說明：

在 IE9 之前的版本，如果使用.prop()為 DOM 元素的 property 設置的值不是一個簡單的原始值（number、string 或 boolean），且該 property 在 DOM 元素從 document 移除前未被移除（使用 .removeProp()），則會導致內存泄漏。為 DOM 對象設置值的安全做法（避免內存泄漏）是使用.data()。