今天這里寫這個(gè)博客的主要目的是記錄一下javascript原生的選擇dom的集中方法。

　　1.document.getElementById。這個(gè)方法接收1個(gè)參數(shù)，就是DOM元素的id（區(qū)分大小寫），這也是平時(shí)用的最多的方法，并且用這種方法DOM查找的效率是最高的，所以如果能用id查找的dom元素盡量用id來查詢，返回的類型是DOM ELEMENT。

　　2.document.getElementsByTagName。這個(gè)方法接收1個(gè)參數(shù)，需要查詢的元素標(biāo)簽（不區(qū)分大小寫）。返回的是一個(gè) HTMLCollection集合。由于HTMLCollection中存在方法item()和namedItem()這兩個(gè)方法，所以需要取到特定的元素就有2種方法，例：var tags = document.getElementsByTagName("div");

• 1 通過item取值。傳入的是一個(gè)數(shù)值型的參數(shù),代表在集合中的位置。var div1 = tags.item(0)。取得tags中的第一個(gè)元素。當(dāng)然也可以用tags[0]來表示。
• 2 通過namedItem來取值。傳入的1個(gè)參數(shù)，可以是需要查找元素的id或者是name。var div1 = tags.namedItem("name")。取到id或者name為“name”的元素。也可以用tags["name"]來表示，結(jié)果相同。

　　3.document.getElementsByName。該方法接收1個(gè)參數(shù)，查找元素的name特性，不是id（區(qū)分大小寫）。返回的是一個(gè)NodeList類型的集合。其中帶有方法item。使用的方法和方法2類似，但是由于沒有namedItem方法，所以不能通過namedItem和["name"]來獲取到相關(guān)元素。

　　4.document.getElementsByClassName。該方法接收1個(gè)參數(shù)，需要查找元素的class名。可以包含一個(gè)或多個(gè)類型的字符串，返回的類型也是HTMLCollection集合。比如需要查找?guī)в衦ed、blue類的元素，可以用document.getElementsByClassName("red blue")。類名的先后順序無所謂。然后用與方法2相同的方式選擇某個(gè)元素。

　　5.querySelector。該方法接收1個(gè)參數(shù)，一個(gè)css選擇符。如果沒有找到匹配的元素返回的就是null，如果找到匹配的元素就返回第一個(gè)匹配的元素。比如var body = document.querySelector("body")。如果傳入的css選擇符出錯(cuò)，則會(huì)拋出錯(cuò)誤。

　　6.querySelectorAll。接收的參數(shù)也是一個(gè)css選擇符。返回的類型是一個(gè)NodeList集合。底層實(shí)現(xiàn)則類似于一組元素的快照，并非不斷對文檔進(jìn)行搜索的動(dòng)態(tài)查詢。如果傳入的css選擇符出錯(cuò)，則會(huì)拋出錯(cuò)誤。

　　

轉(zhuǎn)載于:https://www.cnblogs.com/cmxwt/p/7110393.html

總結(jié)

以上是生活随笔為你收集整理的javascript 原生得到document.Element的方法的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。