DOM物件屬性(property)與HTML標籤特性(attribute)

HTML中property與attribute是極易混淆的兩個概念。大多數時候這兩個單詞都翻譯為“屬性”,為了區分二者，一般將property翻譯為”屬性”，attribute翻譯為”特性”。

每一個HTML標籤(tag)都對應一個DOM介面HTMLXxxElement,比如Span標籤對應的是HTMLSpanElement。這些標籤的DOM介面都繼承自HTMLElement介面，而HTMLElement又繼承自Element。我們知道所有的標籤都是一個元素結點,因此Element介面又繼承自Node介面。其實HTML文件樹中的所有東西都是結點,只不過有不同的結點型別而已。

property就是DOM物件的屬性,就像普通的javascript物件的屬性一樣一樣的,因為DOM物件就是一個地道的javascript物件，也有自己的原型鏈。
而attribute則是HTML標籤的特性,比如

這裡id和title是HTML標籤div的特性,雖然對應的DOM物件HTMLDivElement也有這兩個屬性，但它們卻是完全不一樣的東西。有些特性與屬性是同步的。

HTML標籤的attribute以類陣列的形式儲存在對應DOM物件的屬性attributes中,attributes屬性的型別為NamedNodeMap物件。
DOM物件提供了方法setAttribute，getAttribute和removeAttribute來操縱HTML標籤的特性。

HTML標籤attribute的名字和值都必須為字串型別，而DOM物件的property沒有此限制，可以是任何型別。

有些HTML標籤的attribute有對應的DOM物件property,但它們的取值卻不一定是相同的。一般來說相對應的attribute與property其名字是一樣的，但是class特性有所不同，因為class在javascript中為關鍵字，所以其所對應的property名字為className。

有些簡單的特性,比如id,兩者的取值是一樣的。

但對於input的value,使用getAttribute獲取的永遠是寫HTML標籤時指定的那個值,而value屬性則獲取到的是input當前輸入的值。
而另一些特性比如checked,只要checked特性存在，無論其值是什麼，DOM物件的checked屬性的值都是true。這裡checked屬性已經不是字串而是布林型別了。

還有一些特性比如style和onclick,其對應的DOM屬性完全是返回一個物件了,比如elem.style屬性就返回一個CSSStyleDeclaration物件。

HTML自定義attribute沒有對應的DOM物件property。

References:
[1]attribute和property的區別
[2]JavaScript中的property和attribute的區別
[3]SD9006: IE 混淆了 DOM 物件屬性（property）及 HTML 標籤屬性（attribute），造成了對 setAttribute、getAttribute 的不正確實現
[4]The HTML DOM Element Object
[5]DOM元素的特性（Attribute）和屬性（Property）

===
你自己的程式碼如果超過6個月不看，再看的時候也一樣像是別人寫 —— 伊格爾森定律

載自：http://openwares.net/linux/dom_property_element_attribute.html