javascript通過元素id和name直接取得元素的方法

javascript通過元素id和name直接取得元素的方法

 　　這篇文章主要介紹了javascript通過元素id和name直接取得元素的方法,涉及javascript擷取元素的相關技巧,非常具有實用價值,需要的朋友可以參考下

　　本文執行個體講述了javascript通過元素id和name直接取得元素的方法。分享給大家供大家參考。具體分析如下：

　　我們知道一些第三方的js庫對如何快速選取html中的元素做了一些簡化，貌似十分高深莫測，其實也不然。而且js本身內建了對於特殊元素的簡便選取的方法，下面就為大家簡單介紹下。

　　在html中，一般最直接的辨別html元素使用的是name和id屬性，兩者有著細微的不同：id必須頁面唯一，但name可以有重複。

　　在js中如果id名稱不和內建屬性或全域變數重名的話，該名稱自動成為window對象的屬性，而在一個html頁面中的最頂層環境中有:

　　?

1	this === window

　　所以如果我們寫一個如下的html元素代碼就可以這樣引用它：

　　?

1 2 3 4 5

<input type="button" id="btn_ok" value="Ok" onclick="..." /> //可以這樣引用 btn_ok.onclick = function(){}; //或者下面也是一樣的 window.btn_ok.style = ...;

　　對於name屬性來說，只有某些類型的html元素具有類似的方法，比如：form,img,iframe,applet,embed,object等。在這些元素中可以通過全域變數或者document的屬性來訪問特定name屬性的元素;如果相同name屬性的有多個元素，則返回一個NodeList的類似唯讀數組的對象,例如如下代碼:

　　?

1 2 3 4 5 6 7 8 9 10 11

<div> <img name="pic" src="#" alt="pic_0" /> <img name="pic" src="#" alt="pic_1" /> <img name="pic" src="#" alt="pic_2" /> </div> //我們可以這樣引用name為pic的元素： for(x in pic) console.log(pic[x].alt); //或者是非"標準"文法each語句方式 for each(img in pic) console.log(img.alt);

　　希望本文所述對大家的javascript程式設計有所協助。