html添加子节点方法,HTML DOM appendChild() 方法

HTML DOM appendChild() 方法

appendChild()方法的作用是：在指定父节点的子节点列表的末尾添加一个节点。

如果给定的子节点是文档中现有节点的引用，appendChild()将它从当前位置移动到新位置(参见下面的“更多示例”)。

使用insertBefore()方法可在指定的现有子节点之前插入新的子节点。

语法：node.appendChild(node)

示例var newElem = document.createElement("h3"); // 创建一个新的h3元素

var newContent = document.createTextNode("嗨，你好!"); // 创建一些文本内容

newElem.appendChild(newContent); // 将文本节点添加到新创建的h3

document.body.appendChild(newElem); // 将新创建的元素及其内容添加到DOM中测试看看‹/›

注意：如果要创建带有文本的新元素，请记住将文本创建为Text节点，然后将其附加到元素，然后将该元素附加到文档。

浏览器兼容性

所有浏览器完全支持appendChild()方法：Method

appendChild()是是是是是

参数值参数描述

node要附加到给定父节点的节点(通常是元素)

技术细节返回值：返回的值是附加的子元素

DOM版本：DOM级别1

更多示例

创建一个

元素并将其附加到一个

元素：

示例var para = document.createElement("p"); // Create a

node

var txt = document.createTextNode("This is a paragraph.");// Create a text node

para.appendChild(txt);// Append the text to

document.getElementById("demo").appendChild(para);// Append

测试看看‹/›

创建一个

元素并将其附加到文档主体的末尾：

示例var para = document.createElement("p"); // Create a

node

var txt = document.createTextNode("This is a paragraph.");// Create a text node

para.appendChild(txt);// Append the text to

document.body.appendChild(para);// Append

to body测试看看‹/›

此示例将元素从其当前位置移动到新位置：

示例var elem = document.getElementById("myList2").lastElementChild;

document.getElementById("myList1").appendChild(elem);测试看看‹/›

html添加子节点方法,HTML DOM appendChild() 方法相关推荐

eletree append方法添加子节点
eletree append方法添加子节点 eletree官方文档中,提供了append方法用于添加子节点. append方法接收两个参数,key.data.key很好理解,是你选择添加子节点的节点k ...
HTML DOM appendChild() 方法
1. 1 <!DOCTYPE html> 2 <html> 3 <body> 4 5 <ul id="myList"><li& ...
php查找文件内元素,如何查看当前文档某个元素的子节点？有几种方法
本篇文章给大家带来的内容是关于如何查看当前文档某个元素的子节点?有几种方法,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助. 源代码: Hello 方式一://直接在html文档中嵌入j ...
unity查找子物体、子节点、获取子节点对象脚本，添加子节点脚本，添加父节点脚本
分享一个代码管理片段的代码,主要是用于查找子物体,控制子物体等等的. 静态代码片段,便于调用. 不做太多的解释,直接上代码,每个方法都有注释. 有任何问题直接留言,看到会回复 QQ群 20701909 ...
qteewidgetitem添加子节点_行为树的节点
一,行为树几大节点: Root节点:只能有一个子节点,并且该节点必须是" 复合"节点.不能将任何Decorator或Service附加到Root,在root可以指定其黑板资源: T ...
[Web]removeChild删除子节点只删除一半解决方法
今天在做js删除子节点的时候发现每次删除只删除一半,遂查明后原来如此. 错误代码: var minuss = document.getElementsByClassName("minus&q ...
jQuery删除和添加子节点
//删除子节点 $("#addInfos").children("#div").remove();//增加子节点 $("#text")[0] ...
HTML语言中 blur()方法,HTML DOM blur() 方法
HTML DOM blur() 方法 blur() 方法用于从链接上移开焦点. blur() 方法可把键盘焦点从顶层浏览器窗口移走,整个窗口由 Window 对象指定.哪个窗口最终获得键盘焦点并没有指 ...
Java为xml跟节点添加子节点_如何将xml节点作为第一个子节点插入Java中的另一个xml文档中？...
小编典典如果事实证明我只是为您做功课,我会感到非常恼火. package com.akonizo.examples; import java.io.ByteArrayInputStream; imp ...

html添加子节点方法,HTML DOM appendChild() 方法

html添加子节点方法,HTML DOM appendChild() 方法相关推荐

最新文章

热门文章