JavaScript HTML DOM 节点
2024-09-02 19:28:40
要向HTML DOM添加新元素，必须首先创建元素（元素节点），然后将其附加到现有元素。
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<title>教程（jc2182.com）</title>
<body>
<div id="div1">
<p id ="p1">这是一个段落。</p>
<p id ="p2">这是另一段。</p>
</div> <script>
var para = document.createElement("p");
var node = document.createTextNode("这是新的.");
para.appendChild(node);
var element = document.getElementById("div1");
element.appendChild(para);
</script> </body>
</html>
appendChild()上一个示例中的方法将新元素作为父项的最后一个子项附加。如果您不希望可以使用insertBefore()方法：
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<title>蝴蝶（jc2182.com）</title>
<body> <div id="div1">
<p id ="p1">这是一个段落。</p>
<p id ="p2">这是另一段。</p>
</div> <script>
var para = document.createElement("p");
var node = document.createTextNode("这是新的.");
para.appendChild(node); var element = document.getElementById("div1");
var child = document.getElementById("p1");
element.insertBefore(para,child);
</script> </body>
</html>
要将元素替换为HTML DOM，请使用以下replaceChild()方法：
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<title>蝴蝶（jc2182.com）</title>
<body> <div id="div1">
<p id ="p1">这是一个段落。</p>
<p id ="p2">这是另一段。</p>
</div> <script>
var parent = document.getElementById("div1");
var child = document.getElementById("p1");
var para = document.createElement("p");
var node = document.createTextNode("这是新的.");
para.appendChild(node);
parent.replaceChild(para,child);
</script> </body>
</html>
JavaScript HTML DOM 节点的增删改查
最新文章
- JavaIO 将数据写入到文件中去
- C# 自定义文件图标 双击启动 （修改注册表）
- 查看cpu
- C#检测键盘输入
- javascript 函数初探 （六）--- 闭包初探#1
- Android Studio ：Android Studio 与 Gradle 深入【二】
- php使用文件缓存
- JS重点特性——闭包详解
- oracle often commands
- python执行linux的shell命令
- 不能设置sublime text 2 为默认编辑器
- linux启动的过程
- 分布式锁 基于Redis
- HDU 5781 ATM Mechine
- 【微信小程序开发教程】如何显示群名称？
- Java中常见的URL问题及解决方案
- Prometheus监控数据格式学习
- 【easy】118.119.杨辉三角
- ubuntu nginx ssl 证书配置
- gulp使用入门