JS获取DOM节点的几种方式

关注

原创最新推荐文章于 2026-05-23 16:00:09 发布 1k 阅读 AI 写同款· GEO 优化 ›

Javascript和Jquery对DOM节点的文本创建、获取及操作 Javascript和Jquery对DOM节点的文本创建、获取及操 javascript和jquery获取，添加，删除等操作DOM节点，文本及属性如：JS:atteibutes/firstChild/appendChild()/getAttribute() JQ: attr()/next()/siblings()/append()/remove()等一，Javascript DOM节点... 阅读详情

今天做的一个功能是显示留言需要将被@人的名字变成蓝色，但是返回的数据都是html形式，然后我想到通过dom节点获取到innerText带有@的span标签并改变样式，正好复习一下js获取dom节点的几种方式
在这里插入图片描述

1.getElementById() — id选中元素
    var getid=document.getElementById('id名字')
2.getElementsByClassName() — 类名选中元素
    var getclass=document.getElementsByClassName('类名')
3.getElementsByTagName() — 标签名选中元素
 	var gettag=document.getElementsByTagName('标签名')
4.getElementsByName() — 通过name属性获取元素
    var getname=document.getElementsByName('name名') 

	下面获取元素括号中的写法和css的选择器写法相同
5.querySelector() — 精准的获取某个元素 
    var f=document.querySelector("#tabelList li:nth-child(2)")
6.querySelectorAll()获取符合类名或者标签名等条件的的所有元素
    var g=document.querySelectorAll('.box p>span')