DOM获取页面元素

最新推荐文章于 2024-09-05 09:55:14 发布

limit for me

最新推荐文章于 2024-09-05 09:55:14 发布

阅读量202

点赞数 1

分类专栏： js 文章标签： dom

本文链接：https://blog.csdn.net/limmt2020/article/details/119485910

版权

js 专栏收录该内容

44 篇文章 5 订阅

订阅专栏

DOM获取页面元素

最近刚学了dom，自己对获取元素这块做个总结

1、
元素对象.innerHTML //获取内部的HTML内容
元素对象.textContent //获取文本内容
.value //单标记 input

2、DOM树中查找
如

<body>
	<span id="s1">Hello</span>
	<h1>标题一</h1>
</body>

span查找父级：span.parentElement
body查找子集(集合元素)：body.children
第一个 span：body.firstElementChild
最后一个 h1：body.lastElementChild
兄弟中 span与h1的关系
前一个子节点：h1.previousElementSibling
后一个子节点：span.nextElementSibling

3、查找
id查找：document.getElementById(“xxx”);
标签查找：document.getElementsByTagName(“标签名”);
class查找：document.getElementsByClassName(“xxx”);
name查找：document.getElementsByName(“xxx”);
选择器查找：
document.querySelector(“选择器”)
document.querySelectorAll(“选择器”)
除了name中的document不能更改，其余都代表范围

4、修改属性
查找到的元素.属性名=“属性值”
可以直接修改元素属性