關於經過id名獲取dom元素的問題

在用js作編輯功能時候,發現一種奇怪的寫法。用到了沒有定義的變量來直接操做dom，查詢以後

發現這個小的知識點。

標籤有id這個屬性，不使用getElementById方法，也能夠直接用id獲取dom元素。並且最讓我意

外的是瀏覽器支持程度，Firefox、chrome支持不意外，意外的是IE竟然7-11都支持 。

這是由於，若是在HTML文檔中用id屬性來爲元素命名，而且若是Window對象沒有此名字的屬性，

Window對象會賦予一個屬性，它的名字就是id屬性的值，而它們的值指向表示文檔元素的HTMLElement

對象。

在客戶端Javascript中，Window對象是以全局對象的形式存在於做用域鏈的最上層，這就意味着

在HTML文檔中使用的id屬性會成爲被腳本訪問的全局變量。若是文檔包含一個<div id='box'>元素，

那麼就能夠經過全局變量box來引用此元素。

可是，有一個很重要的警告，若是Window對象已經具備此名字的屬性，這就不會發生。好比，id

是「history」,「location」的元素，就不會以全局變量的的形式出現，由於這些id已經被佔用了。

一樣，若是HTML文檔包含一個id爲「x」的元素，而且在代碼中聲明並賦值給全局變量x，那這個變量

的存在就會阻止元素獲取它的window屬性，而若是腳本中的變量聲明出如今命名元素以後，那麼變量

的顯示賦值會覆蓋該屬性的隱式值。

元素id做爲全局變量的隱式應用是web瀏覽器演化過程當中遺留的怪癖。它主要是出於與已有web頁

面後向兼容性的考慮，但這裏並不推薦使用這種作法。瀏覽器廠商能夠在任什麼時候候爲window對象定義

新屬性，而這些新屬性都會破壞使用了此屬性名的隱式定義的代碼。

因此，但願經過id名來獲取dom元素，最好仍是使用document.getElementById()，這是一個

document對象的方法，能夠經過它來得到指定id的html元素。更多技術資訊可關注：gzitcast