cloneNode和replaceChild
node.cloneNode(deep)
var node=document.getElementById("myList2").lastChild.cloneNode(true);
document.getElementById("myList1").appendChild(node); var node = document.getElementById("demo");
console.log(node.firstChild);
console.log(node.firstElementChild);
console.log(node.childNodes);
如果您需要克隆所有后代,请把 deep 参数设置 true,否则设置为 false。
node.replaceChild(newnode,oldnode);
<ul id="myList"><li>Coffee</li><li>Tea</li><li>Milk</li></ul> <p id="demo">点击按钮来替换列表中的首个项目。</p> <button onclick="myFunction()">试一下</button> <script>
function myFunction()
{
var textnode=document.createTextNode("Water");
var item=document.getElementById("myList").childNodes[0];
item.replaceChild(textnode,item.childNodes[0]);
}
</script>
cloneNode和replaceChild的更多相关文章
- 回流(reflow)与重绘(repaint)
最近项目排期不紧,于是看了一下之前看了好久也没看明白的chrome调试工具的timeline.但是很遗憾,虽然大概懂了每一项是做什么的,但是用起来并不能得心应手.所以今天的重点不是timeline,而 ...
- jQuery 源码分析(二十) DOM操作模块 插入元素 详解
jQuery的DOM操作模块封装了DOM模型的insertBefore().appendChild().removeChild().cloneNode().replaceChild()等原生方法.分为 ...
- 浏览器渲染页面原理,reflow、repaint及其优化
浏览器的主要组件包括: 1. 用户界面 - 包括地址栏.前进/后退按钮.书签菜单等.除了浏览器主窗口显示的你请求的页面外,其他显示的各个部分都属于用户界面. 2. 浏览器引擎 - ...
- [js高手之路] dom常用API【appendChild,insertBefore,removeChild,replaceChild,cloneNode】详解与应用
本文主要讲解DOM常用的CURD操作,appendChild(往后追加节点),insertBefore(往前追加节点),removeChild(移除节点),replaceChild(替换节点),clo ...
- javascript 节点操作拷贝节点cloneNode()
cloneNode(a)方法接受一个布尔值参数,表示是否深拷贝 true:表示执行深拷贝,复制本节点以及整个子节点树. false:浅拷贝.只复制节点本身. 复制后返回的节点副本属于文档所有,但是并没 ...
- 复制节点(cloneNode)
DOM提供用来复制节点方法. cloneNode():将为给定节点创建一个副本,这个方法的返回值是一个指向新建克隆节点的引用指针, reference = node.cloneNode(deep) 这 ...
- Node.cloneNode()方法
概述 返回调用该方法的节点的一个副本. 语法 var dupNode = node.cloneNode(deep);node将要被克隆的节点dupNode克隆生成的副本节点deep 可选是否采用深度克 ...
- cloneNode小结
js原生API中有个cloneNode,还有一个可选的参数, true代表复制子节点,包括任何包裹在标签之间的东西,当然包括文本节点,也就是标签之间有什么,它就会不假思索的全部都克隆一份. false ...
- JQ中的clone()方法与DOM中的cloneNode()方法
JQ中的clone()方法与DOM中的cloneNode()方法 cloneNode()定义和用法 cloneNode()方法创建节点的拷贝,并返回该副本. 语法: node.cloneNode(de ...
随机推荐
- C语言拼接字符串以及进制转换
#include<stdio.h> #include<stdlib.h> #include<string.h> char *join1(char *, char*) ...
- hive:条件判断函数
参考hive常用运算. •If函数: if •非空查找函数: COALESCE •条件判断函数:CASE • If 函数 : if 语法: if(boolean testCondition, T va ...
- Hi3531支持2GByte内存
型号为K4B4G1646B-HCKO 1.修改DDRC_RNKCFG 为 0x142 2.修改arch/arm/mach-godnet/include/mach/vmalloc.h 扩大 vmallo ...
- AM335X的USB otg网卡(RNDIS /Ethernet Gadget)调试
重新编译内核(2.6.29) 2.6.29内核 Device Drivers ---> USB support ---> USB Gadget Support ...
- Hibernate中的条件查询完成类
Hibernate中的条件查询有以下三个类完成: 1.Criteria:代表一次查询 2.Criterion:代表一个查询条件 3.Restrictions:产生查询条件的工具类
- vxWorks下dosFs文件系统的创建
.cdromFs:允许系统从按照ISO9660标准文件系统格式化的CD-ROM上读取设备: 通常文件系统驱动位于磁盘(块存取)设备驱动和IO系统之间,这一点在VxWorks中也不例外,但它在此基础上扩 ...
- Linux显示系统日期
Linux显示系统日期 youhaidong@youhaidong-ThinkPad-Edge-E545:~$ date 2015年 01月 21日 星期三 20:37:39 CST
- 空间主页播放任意FLV格式视频方法
把文件上传到QQ网络硬盘 打开 硬盘 的 管理 选项 然后它会打开QQ邮箱的文件中转站 找到你要的视频文件 点击下载它 这里建议你使用搜狗浏览器打开网页 来到下载按钮点击下载,在弹出的对话框中选择 ...
- 洛谷P4180 [Beijing2010组队]次小生成树Tree(最小生成树,LCT,主席树,倍增LCA,倍增,树链剖分)
洛谷题目传送门 %%%TPLY巨佬和ysner巨佬%%% 他们的题解 思路分析 具体思路都在各位巨佬的题解中.这题做法挺多的,我就不对每个都详细讲了,泛泛而谈吧. 大多数算法都要用kruskal把最小 ...
- Emacs配置(考场必备)(Emacs)
最近有几次离开自己一直坐着的座位,去别的机房考试了. 于是猛然想起来要记一记Emacs的简洁配置了. 算是把NOIP残存的记忆再拾一点起来...... 附上一些解释 (global-set-key [ ...