博客
关于我
JavaScript HTML DOM 元素(节点)
阅读量:211 次
发布时间:2019-02-28

本文共 803 字,大约阅读时间需要 2 分钟。

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

创建新的 HTML 元素

要向 HTML DOM 中添加新元素,您需要先创建该元素(元素节点),然后将该元素追加到已有元素中。

实例

以下代码创建了一个新 p 元素,并添加了一个文本节点:

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

然后将新元素追加到已有元素中:

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

删除已有的 HTML 元素

要删除 HTML 元素,您需要先获得该元素的父元素。

实例

以下代码删除了 id="p1" 的 p 元素:

var parent = document.getElementById("div1");var child = document.getElementById("p1");parent.removeChild(child);

或者,您可以直接通过子元素的 parentNode 属性删除:

var child = document.getElementById("p1");child.parentNode.removeChild(child);

HTML DOM 教程

在我们的 JavaScript 教程的 HTML DOM 部分,您已经学到了:

  • 如何改变 HTML 元素的内容 (innerHTML)
  • 如何改变 HTML 元素的样式 (CSS)
  • 如何对 HTML DOM 事件作出反应
  • 如何添加或删除 HTML 元素

如果您希望学习更多关于使用 JavaScript 访问 HTML DOM 的知识,请访问我们完整的 JavaScript教程

转载地址:http://xxes.baihongyu.com/

你可能感兴趣的文章
npm的“--force“和“--legacy-peer-deps“参数
查看>>
npm的安装和更新---npm工作笔记002
查看>>
npm的常用操作---npm工作笔记003
查看>>
npm的常用配置项---npm工作笔记004
查看>>
npm的问题:config global `--global`, `--local` are deprecated. Use `--location=global` instead 的解决办法
查看>>
npm编译报错You may need an additional loader to handle the result of these loaders
查看>>
npm设置淘宝镜像、升级等
查看>>
npm设置源地址,npm官方地址
查看>>
npm设置镜像如淘宝:http://npm.taobao.org/
查看>>
npm配置安装最新淘宝镜像,旧镜像会errror
查看>>
NPM酷库052:sax,按流解析XML
查看>>
npm错误 gyp错误 vs版本不对 msvs_version不兼容
查看>>
npm错误Error: Cannot find module ‘postcss-loader‘
查看>>
npm,yarn,cnpm 的区别
查看>>
NPOI
查看>>
NPOI之Excel——合并单元格、设置样式、输入公式
查看>>
NPOI初级教程
查看>>
NPOI利用多任务模式分批写入多个Excel
查看>>
NPOI在Excel中插入图片
查看>>
NPOI将某个程序段耗时插入Excel
查看>>