通过id的方式获取元素节点document.getElementById(“id_name”)
<div id="shuzi">123456</div><script type="text/javascript">//文档.得到元素的idvar a = document.getElementById("shuzi")console.log(a)//返回元素对象,更好的查看里面的属性和方法console.dir(a)</script>
通过标签的方法获取,以伪数组的形式返回元素对象的集合;document.getElementsByTagName(‘li’)根据类名获取元素document.getElementsByClassName(‘类名’)querySelector/什么都能选 ,返回所选的第一个元素,选择类需要. id需要#document.querySelector(’#nav’);document.querySelector(‘li’);querySelectorAll 返回所有的匹配元素;document.querySelectorAll(‘li’)
代码演示:
<!DOCTYPE html><html><head><meta charset="UTF-8"><title></title></head><body><div id="shuzi">123456</div><ul class="cl"><li>123</li><li>123</li><li>123</li><li>123</li><li>123</li></ul><ul id="nav"><li class="li">1234</li><li>12344</li><li>12344</li><li>12344</li><li>12344</li></ul><script type="text/javascript">//文档.得到元素的idvar a = document.getElementById("shuzi")console.log(a)//返回元素对象,更好的查看里面的属性和方法console.dir(a)//通过标签的方法获取,返回元素对象的集合,以伪数组的形式var b = document.getElementsByTagName('li')console.dir(b)console.log(b[1])//获取某一标签下的元素var nav = document.getElementById('nav')var c = nav.getElementsByTagName('li')console.log(c[0])//根据类名获取元素var d = document.getElementsByClassName('cl')console.log(d)//querySelector/什么都能选 ,返回所选的第一个元素,选择类需要. id需要#var e = document.querySelector('#nav')console.log(e)var f = document.querySelector('li')console.log(f)//querySelectorAll 返回所有的匹配元素var g = document.querySelectorAll('li')console.log(g)console.log(g[0])</script></body></html>