您好,登錄后才能下訂單哦!
這篇文章將為大家詳細講解有關javascript如何獲得元素,小編覺得挺實用的,因此分享給大家做個參考,希望大家閱讀完這篇文章后可以有所收獲。
javascript是一種動態類型、弱類型的語言,基于對象和事件驅動并具有相對安全性并廣泛用于客戶端網頁開發的腳本語言,同時也是一種廣泛用于客戶端Web開發的腳本語言。它主要用來給HTML網頁添加動態功能,現在JavaScript也可被用于網絡服務器,如Node.js。
javascript獲得元素的方法:1、通過getElementById獲取id屬性的節點對象;2、通過getElementsByTagName獲取對象數組;3、通過getElementsByClassName獲取指定class名的元素。
本文操作環境:windows7系統、javascript1.8.5版、Dell G3電腦。
常見的獲取元素的方法有3種,分別是通過元素ID、通過標簽名字和通過類名字來獲取。
getElementById
DOM提供了一個名為getElementById的方法,這個方法將返回一個與之對應id屬性的節點對象。使用的時候請注意區分大小寫。
它是document對象特有的函數,只能通過其來調用該方法。其使用的方法如下:
代碼如下:
document.getElementById('demo') //demo是元素對應的ID
該方法兼容主流瀏覽器,甚至包括IE6+,可以大膽使用。
getElementsByTagName
該方法返回一個對象數組(準確的說是HTMLCollection集合,它不是真正意義上的數組),每個對象分別對應著文檔里有著給定標簽的一個元素。類似于getElementById,同樣,該方法只提供一個參數,它的參數是指定標簽的名字,示例代碼如下:
代碼如下:
document.getElementsByTagname('li') //li是標簽的名字
需要注意的是,該方法除了能被document對象調用之外,還可以被普通的元素調用。示例如下:
代碼如下:
var demo = document.getElementById('demo'); var lis = demo.getElementsByTagname('li');
同樣,該方法兼容主流瀏覽器,甚至包括IE6+,可以大膽使用。
getElementsByClassName
除了通過指定標簽獲取元素外,DOM還提供了getElementsByClassName方法來獲取指定class名的元素。不過由于該方法比較新,較老的瀏覽器還不支持,比如IE6。不過我們可以通過hack方式來彌補老瀏覽器缺陷。該方法調用的方式如下所示:
代碼如下:
document.getElementsByClassName('demo') //demo為元素指定的class名
和getElementsByTagname一樣, 該方法除了能被document對象調用之外,還可以被普通的元素調用。
對于比較老的瀏覽器,比如IE6、7我們可以通過下面的hack方式來實現:
代碼如下:
function getElementsByClassName(node,classname){ if(node.getElementsByClassName) { return node.getElementsByClassName(classname); }else { var results = []; var elems = node.getElementsByTagName("*"); for(var i = 0; i < elems.length; i++){ if(elems[i].className.indexOf(classname) != -1){ results[results.length] = elems[i]; } } return results; } }
關于“javascript如何獲得元素”這篇文章就分享到這里了,希望以上內容可以對大家有一定的幫助,使各位可以學到更多知識,如果覺得文章不錯,請把它分享出去讓更多的人看到。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。