筆記 前端需要了解的attribute和property的區別

定義

Property:屬性,所有的HTML元素都由HTMLElement類型表示,HTMLElement類型直接繼承自Element並添加了一些屬性,添加的這些屬性分別對應於每個HTML元素都有下面的這5個標準特性: id,title,lang,dir,className。DOM節點是一個對象,因此,他可以和其他的JavaScript對象一樣添加自定義的屬性以及方法。property的值可以是任何的數據類型,對大小寫敏感,自定義的property不會出現在html代碼中,只存在js中

Attribute:特性,區別於property,attribute只能是字符串,大小寫不敏感,出現在innerHTML中,通過類數組attributes可以羅列所有的attribute。

相同之處

標準的 DOM properties 與 attributes 是同步的。公認的(非自定義的)特性會被以屬性的形式添加到DOM對象中。如,id,align,style等,這時候操作property或者使用操作特性的DOM方法如getAttribute()都可以操作屬性。不過傳遞給getAttribute()的特性名與實際的特性名相同。因此對於class的特性值獲取的時候要傳入“class”。

不同之處

  1. 對於有些標準的特性的操作,getAttribute與點號(.)獲取的值存在差異性。如href,src,value,style,onclick等事件處理程序。
  2. .href:getAttribute獲取的是href的實際值,而點號獲取的是完整的url,存在瀏覽器差異。
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章