js獲取dom節點的方法有哪些
本文教程操作環境:windows7系統、jquery3.2.1版本,DELL G3電腦。
1、透過id來獲取dom節點
getElementById 是透過標籤的 id 名稱來獲取標籤的,返回的是一個HTML的節點資訊。
<div id="box">我是透過ID選擇器選擇的</div> <script> var divid = document.getElementById("box"); console.log(divid); </script>
2、透過class來獲取dom節點
getElementsByClassName 是透過標籤的 class 名稱來獲取標籤的,返回的是一個HTMLCollection物件。
<div class="box"></div> <div class="box"></div> <script> let boxCollection= document.getElementsByClassName("box"); let box1 = boxList[0]; let box2 = boxList[1]; </script>
3、透過name來獲取dom節點
getElementsByName 是透過過標籤的name名稱來獲取標籤的返回的是一個NodeList物件。
<div id="box"> <input type="text" name="user" /> </div> <script> let userInput= document.getElementsByName("user"); </script>
4、透過tagName(標籤名)來獲取dom節點
getElementsByTagName 是透過過標籤的標籤名稱來獲取標籤的,返回的是一個HTMLCollection物件。
<body> <div></div> <script> var box = document.getElementsByTagName('div') console.log(box) // [<div></div>] console.log(box[0]) // <div></div> </script></body>
以上就是小編整理總結的四種JavaScript獲取dom節點的方法,希望能幫助你理解哦~更多JavaScript學習推薦:。
來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/2730/viewspace-2831138/,如需轉載,請註明出處,否則將追究法律責任。
相關文章
- Javascript 獲取 Dom 樣式的方法有哪些JavaScript
- js獲取節點元素物件的方法介紹JS物件
- js中dom節點刪除remove方法JSREM
- JavaScript獲取HTML DOM節點元素詳解(轉)JavaScriptHTML
- JS中的DOM— —節點以及操作JS
- python中pyquery無法獲取標籤名的dom節點Python
- python元組有哪些獲取元素的方法Python
- jQuery操作dom節點empty()方法jQuery
- 原生JS獲取DOM 節點到瀏覽器頂部的距離或者左側的距離JS瀏覽器
- js判斷dom節點是否存在JS
- js獲取元素的方法(獲取html元素的方法)JSHTML
- 封裝js獲取當前元素的弟弟元素節點封裝JS
- jquery獲取元素節點jQuery
- jquery獲取指定節點的第一級文字節點jQuery
- 原生JS中DOM節點相關API合集JSAPI
- jQuery如何獲取元素父節點和子節點jQuery
- 獲取React元件的DOMReact元件
- js獲取表格方法JS
- js獲取頁面dom元素的幾種常用方式JS
- 怎樣獲取jstree的節點資料_大資料獲客是怎樣獲取精準客源的JS大資料
- jQuery獲取節點的標籤名稱jQuery
- jQuery DOM節點的遍歷jQuery
- js用字首名查詢class或id節點,js模糊查詢某個dom節點JS
- 原生js實現的獲取當前元素的上一個元素節點JS
- js實現的獲取指定元素的節點封裝程式碼例項JS封裝
- jQuery關於DOM操作節點一些方法jQuery
- 什麼是海外節點伺服器?海外節點有哪些?伺服器
- JavaScript學習之DOM(節點、節點層級、節點操作)JavaScript
- vue1和vue2獲取dom元素的方法Vue
- JavaScript 獲取所有後代元素節點JavaScript
- 獲取BT節點資訊bittorrent-discovery
- JavaScript獲取父元素下子元素節點JavaScript
- dom元素操作獲取等
- MySQL Json有哪些缺點MySqlJSON
- jquery中dom節點操作方法empty和remove的區別jQueryREM
- js獲取元素的方法與屬性JS
- dom操作新增一個帶有文字的節點程式碼例項
- 原生JS DOM方法JS