【无标题】03

最新推荐文章于 2024-08-31 21:50:03 发布

安蜜

最新推荐文章于 2024-08-31 21:50:03 发布

阅读量48

点赞数 1

文章标签： javascript html linq

本文链接：https://blog.csdn.net/weixin_67333390/article/details/123250889

版权

本文详细讲解了如何通过DOM操作，包括获取元素（如ID、类选择器）、更新节点内容、添加和删除节点，以及使用querySelector和getElementById等方法实例。深入理解DOM树结构及其API应用。

摘要由CSDN通过智能技术生成

操作DOM对象(重点)
DOM:文档对象模型
浏览器网页就是一个Dom树形结构

更新：更新Dom节点
遍历Dom节点：得到DOM节点
删除：删除一个Dom节点
添加：添加一个新的节点
获得dom节点

要操作一个Dom节点，就必须要先获得这个Dom节点

//对应CSS的选择器
var h1 = document.getElementsByTagName('h1');
console.log(h1);
var p1 = document.getElementById('p1');
console.log(p1);
var p2 = document.getElementsByClassName("p2");
console.log(p2);
var father = document.getElementById("father");

//获取父节点下的所有子节点
var childrens = father.children;
father.firstChild
father.lastChild
father.child(0)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
更新节点

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div id = "id1">

</div>
<script>
document.getElementById('id1');
id1.innerText = "abc";
</script>

</body>
</html>

安蜜

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
【无标题】03

操作DOM对象(重点)DOM:文档对象模型浏览器网页就是一个Dom树形结构更新：更新Dom节点遍历Dom节点：得到DOM节点删除：删除一个Dom节点添加：添加一个新的节点获得dom节点要操作一个Dom节点，就必须要先获得这个Dom节点 //对应CSS的选择器 var h1 = document.getElementsByTagName('h1'); console.log(h1); var p1 = document.getElementById('p1...
复制链接

扫一扫