javascript insertBefore 和 appendChild
js的appendChild()方法 :在一个元素内部追加一个子节点.
js的insertBefore()方法:在一个元素内部指定的子节点之前插入子节点.
很明显,appendChild()方法只需要一个条件就可以了,那就是父元素.
而后者则需要两个条件,一个是父元素,一个是要在父元素哪个子节点前插入.
下面是两种情况的例子对比:
var oDiv=document.getElementById('div1');
var oNew=document.createElement('div');
oDiv.appendChild(oNew);
var oDiv=document.getElementById('div2');
var oChild=oDiv.getElementById('div3');
var oNew=document.createElement('div');
oDiv.insertBefore(oNew,oChild);//先写新创建的DIV,后写子节点
javascript insertBefore 和 appendChild的更多相关文章
- javascript中document.appendChild和document.body.appendChild的问题
在IE7中 var conentDiv = document.createElement("div"); document .body .appendChild(conentDiv ...
- insertBefore(),appendChild()创建添加列表实例
定义: insertBefore() 方法在您指定的已有子节点之前插入新的子节点. 语法: 父级.insertBefore(新的子节点,指定的已有子节点) 实例: <input id=" ...
- JavaScript中的appendChild()方法
appendChild()方法是向节点添加最后一个子节点.也可以使用此方法从一个元素向另一个元素移动元素. 案例一:向节点添加最后一个子节点 <!DOCTYPE html> <htm ...
- javascript节点操作appendChild()
cloneNode(a)方法接受一个布尔值参数,表示是否深拷贝 true:表示执行深拷贝,复制本节点以及整个子节点树. false:浅拷贝.只复制节点本身. 复制后返回的节点副本属于文档所有,但是并没 ...
- 使用insertBefore实现insertAdjacentHTML()
Element.insertAdjacentHTML()方法由IE引入,并在HTML5中标准化,它将任意的HTML标记字符串插入到指定的元素“相邻”的位置. insertAdjacentHTML()有 ...
- javascript --- javascript与DOM
javascript与DOM: 我们来个例子,一个HTML里包含一段文本和一个无序的列表. <p id="intro">My first paragraph...< ...
- 读javascript高级程序设计10-DOM
一.节点关系 元素的childNodes属性来表示其所有子节点,它是一个NodeList对象,会随着DOM结构的变化动态变化. hasChildNodes():是否有子节点. var headline ...
- JavaScript 闯关记
DOM(文档对象模型)是针对 HTML 和 XML 文档的一个 API.DOM 描绘了一个层次化的节点树,允许开发人员添加.移除和修改页面的某一部分. 节点层次 DOM 可以将任何 HTML 或 XM ...
- JavaScript高级程序设计22.pdf
操作节点 appendChild()用于向childNodes列表末尾添加一个节点,appendChild()返回新增的节点 var returnedNode=someNode.appendChild ...
随机推荐
- 大文件读取方法(C#)
之前都是用StreamReader.ReadLine方法逐行读取文件,自从.NET4有了File.ReadLines这一利器,就再也不用为大文件发愁了. File.ReadLines在整个文件读取到内 ...
- NODE编程(三)--构建Node Web程序1
一.HTTP服务器的基本知识 1.Node如何向开发者呈现HTTP请求 Node中的http模块提供了HTTP服务器和客户端接口: var http = require('http'); 创建HTTP ...
- 邮件工具类--EmailUtil
/* Copyright Notice ===================================================* * This file contains propri ...
- linux命令行操作快捷键
在shell命令终端中,Ctrl+n相当于方向向下的方向键,Ctrl+p相当于方向向上的方向键. 在命令终端中通过它们或者方向键可以实现对历史命令的快速查找.这也是快速输入命令的技巧. 在命令终端中可 ...
- 【杨氏矩阵+勾长公式】POJ 2279 Mr. Young's Picture Permutations
Description Mr. Young wishes to take a picture of his class. The students will stand in rows with ea ...
- IE升级代码时邮件内容
TypeErrorUnable to set property 'value' of undefined or null reference. 但是可以进入添加页面,填完信息后,submit后跳转至 ...
- HttpClient(4.3.5) - HTTP Header
An HTTP message can contain a number of headers describing properties of the message such as the con ...
- django 学习-3 模板变量
1.vim learn/home.html <!DOCTYPE html><html><head> <title>{{title}}< ...
- 判断DataReader中是否有指定列
取出的DataReader如果在读取过程中报没有列的错误可以用这个方法. //调用该方法判断datareader中是否有指定列 public static bool readerExists(IDat ...
- javascript笔记—— 构造函数
出处:http://www.cnblogs.com/RicCC/archive/2008/02/15/JavaScript-Object-Model-Execution-Model.html 数据类型 ...