php dom手册,DOM 元素 - JavaScript中文参考手册

创建新的 HTML 元素

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

实例

html>

php中文网(php.cn)

这是一个段落。

这是另一个段落。

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

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

para.appendChild(node);

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

element.appendChild(para);

运行实例 »

点击 "运行实例" 按钮查看在线实例

例子解析：

这段代码创建新的

元素：

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

如需向

元素添加文本，您必须首先创建文本节点。这段代码创建了一个文本节点：

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

然后您必须向

元素追加这个文本节点：

para.appendChild(node);

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

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

var

element=document.getElementById("div1");

以下代码在已存在的元素后添加新元素：

element.appendChild(para);

删除已有的 HTML 元素

以下代码演示了如何删除元素：

实例

html>

php中文网(php.cn)

这是一个段落。

这是另一个段落。

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

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

parent.removeChild(child);

运行实例 »

点击 "运行实例" 按钮查看在线实例

实例解析

这个 HTML 文档含有拥有两个子节点(两个

元素)的

元素：

这是一个段落。

这是另一个段落。

找到 id="div1" 的元素：

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

找到 id="p1" 的

元素：

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

从父元素中删除子元素：

parent.removeChild(child);

如果能够在不引用父元素的情况下删除某个元素，就太好了。

不过很遗憾。DOM 需要清楚您需要删除的元素，以及它的父元素。

这是常用的解决方案：找到您希望删除的子元素，然后使用其 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 的知识，请访问我们完整的 HTML DOM 教程。

php dom手册,DOM 元素 - JavaScript中文参考手册 - php中文网手册相关推荐

STM32F0/F1/F2/F3/F4/F7编程数据中英文手册（所有型号中文参考手册)
STM32F0/F1/F2/F3/F4/F7编程数据中英文手册(所有型号中文参考手册) 免费获取STM32所有手册 ST官方免费的资料不应该共享的吗?怎么还欺负人,明码标价.进入官方,第一个就是. 感 ...
Javascript:DOM动态创建元素实例应用
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8" ...
JavaScript基础12-day14【DOM查询(获取元素节点、获取元素节点的子节点)、全选练习、DOM增删改、DOM添加删除记录、Window对象方法】
学习地址: 谷粒学院--尚硅谷哔哩哔哩网站--尚硅谷最新版JavaScript基础全套教程完整版(140集实战教学,JS从入门到精通) JavaScript基础.高级学习笔记汇总表[尚硅谷最新版Ja ...
jQuery: 选择器(DOM,name,属性,元素)
出处:http://www.cnblogs.com/starof/p/5411457.html 大部分选择器都是基于下面这个简单的页面: <!DOCTYPE html> <html ...
前端：JS/27/HTML DOM简介和新特性，HTML DOM访问HTML元素的方法，元素对象的属性（标准属性），noscroll事件，实例：书讯快递
HTML DOM简介和新特性 1,HTML DOM简介核心DOM中,提供的属性和方法,已经可以操作网页了,为什么还要HTML DOM? 如果在核心DOM中,网页中节点层级很深时,访问这个节点时将十分 ...
dom更新到底在javascript事件循环的哪个阶段？「前端每日一题v22.11.17」
dom更新到底在javascript事件循环的哪个阶段?「前端每日一题v22.11.17」昨天写了一篇文章,是javascript的事件循环机制,然后在某乎上也发了,在发的时候看到了一个问题,dom ...
什么是DOM，DOM的作用，以及DOM与JavaScript的关系
一个想学web前端的初学者,如果在知乎中搜索推荐书目的话,得到的答案多数都是:首先,学习htlm+css:第二点就是阅读<JavaScript DOM 编程艺术>这本书. 作为一个初学的小 ...
MySQL中文参考手册--1.MySQL的一般信息
MySQL中文参考手册--1.MySQL的一般信息 0 译者序 MySQL是一个精巧的SQL数据库管理系统,虽然它不是开放源代码的产品,但在某些情况下你可以自由使用.由于它的强大功能.灵活性.丰富的应 ...
WebAPI第一天学习总结—— DOM、获取元素、事件基础、操作元素、节点操作
Web API介绍 API的概念 API(Application Programming Interface,应用程序编程接口)是一些预先定义的函数,目的是提供应用程序与开发人员基于某软件或硬件得以访 ...

php dom手册,DOM 元素 - JavaScript中文参考手册 - php中文网手册

php dom手册,DOM 元素 - JavaScript中文参考手册 - php中文网手册相关推荐

最新文章

热门文章