添加和删除节点(HTML 元素)。

创建新的 HTML 元素

如需向 HTML DOM 添加新元素,您必须首先创建该元素(元素节点),然后向一个已存在的元素追加该元素。

实例

<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>

 

例子解释:

这段代码创建新的 <p> 元素:

var para=document.createElement("p");

如需向 <p> 元素添加文本,您必须首先创建文本节点。这段代码创建了一个文本节点:

var node=document.createTextNode("这是新段落。");

然后您必须向 <p> 元素追加这个文本节点: 

para.appendChild(node);

最后您必须向一个已有的元素追加这个新元素。

这段代码找到一个已有的元素:

var element=document.getElementById("div1");

这段代码向这个已有的元素追加新元素:

element.appendChild(para);

删除已有的 HTML 元素

如需删除 HTML 元素,您必须首先获得该元素的父元素:

<div id="div1">
<p id="p1">这是一个段落。</p>
<p id="p2">这是另一个段落。</p>
</div> <script>
var parent=document.getElementById("div1");
var child=document.getElementById("p1");
parent.removeChild(child);
</script>

  

  

  

  

 

最新文章

  1. [转]How do you create a custom AuthorizeAttribute in ASP.NET Core?
  2. 关于近期项目代码整理(iOS)
  3. 关于NOIP2016与NOI2018
  4. 使用Java练习算法常用的基本操作
  5. Linux3.18.6内核添加系统调用(32位系统)
  6. 两种方式判断类的存在→className getAttribute
  7. 【转】七个例子帮你更好地理解 CPU 缓存
  8. linux性能分析命令和性能观察工具
  9. If-Modified-Since和If-None-Match
  10. UDP vs. TCP
  11. 【转】Java中关于异常处理的十个最佳实践
  12. frameset标签设计页面
  13. python appium 操作app
  14. Maven项目管理工具
  15. node.js http接口调试时请求串行特性分析
  16. 理解Promise的三种姿势
  17. MFC不可不会
  18. DSO论文解读
  19. kibana 显示 @timestamp 时间问题(utc or browser当前时间)自动转换显示
  20. VMware Station NAT上网模式配置

热门文章

  1. Debian下无root权限使用Python访问Oracle
  2. wpf Combobox模拟键盘按键
  3. Docker网络基础:快速指南
  4. iOS AFNetWorking中block执行完后再执行其它操作
  5. 【bzoj3210】花神的浇花集会 旋转坐标系
  6. python学习笔记--python编程基础
  7. webpack错误Chunk.entry was removed. Use hasRuntime()
  8. (转)关于Jackson2.x中com.fasterxml.jackson包的用法
  9. CodeForces 618D Hamiltonian Spanning Tree
  10. 【POJ3352】Road Construction(边双联通分量)