替换节点(replaceChild())
replaceChild():方法将把一个给定父元素里面的一个子节点替换为另一个子节点:
referencre = element.replaceChild(newChild,oldChild);
oldChild节点必须是element元素子节点,他的返回值是一个指向已经被替换的那个子节点的引用指针。
在下例中,id属性值是content的元素还包含着一个id属性值是fineprint的元素,我们将用createElement()方法创建一个新的文本元素,再用replaceChild()方法把fineprint元素替换为那个新创建元素:
var container = document.getElementById("content");
var message = document.getElementById("fineprint");
var para = document.createElement("p");
container.replaceChild(para,message);
如果被插入的元素本身还有子节点,则那些子节点也被插入到目标节点前。
replaceChild()方法也可以用文档树上的现有节点去替换另一个现有节点。如果newChild()节点时文档树上的一个现有节点,replaceChild()方法将先删除它字啊用它去替换oldChild()节点。
在下例中,replaceChild()方法将用id属性值是headline元素去替换content元素所包含的id属性值是fineprint的那个元素:
var container = document.getElement.ById("content");
var message = document.getElementById("fineprint");
var announcement = document.getElementById("headline");
container.replaceChild(announcement,message);
替换节点(replaceChild())的更多相关文章
- 替换元素节点replaceChild()
替换元素节点replaceChild() replaceChild 实现子节点(对象)的替换.返回被替换对象的引用. 语法: node.replaceChild (newnode,oldnew ) 参 ...
- JavaScript---Dom树详解,节点查找方式(直接(id,class,tag),间接(父子,兄弟)),节点操作(增删改查,赋值节点,替换节点,),节点属性操作(增删改查),节点文本的操作(增删改查),事件
JavaScript---Dom树详解,节点查找方式(直接(id,class,tag),间接(父子,兄弟)),节点操作(增删改查,赋值节点,替换节点,),节点属性操作(增删改查),节点文本的操作(增删 ...
- jQuery之替换节点
如果要替换节点,jQuery提供了两个方法:replaceWith()和replaceAll(). 两个方法的作用相同,只是操作颠倒了. 作用:将所有匹配的元素都替换成指定的HTML或者DOM元素.( ...
- jQuery中的查找节点、创建节点、插入节点、删除节点、替换节点、复制节点操作方法
jQuery操作节点我们可以分六点来讲,查找节点.创建节点.插入节点.删除节点.替换节点.复制节点. 一.查找节点 text() - 设置或返回所选元素的文本内容 ,html() - 设置或返回所 ...
- 替换节点及replaceEach方法
需求: 为所有的 li 节点添加 onclick 响应函数实现 city 子节点和 game 子节点对应位置的元素的互换 window.onload = function(){ //自定义互换两个节点 ...
- JQ 替换节点
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jquery 替换节点实例
描述: 要求用户选择一个自己不喜欢的商品 说明: 左边是商品列表,右面显示用户不喜欢的商品. 首先用选择器获得用户点击的元素,然后替换右面用户选择的不喜欢的商品. <!doctype html& ...
- [UE4]蓝图替换节点、引用快捷方式
- 深入理解DOM节点操作
× 目录 [1]创建节点 [2]插入节点 [3]移除节点[4]替换节点[5]复制节点 前面的话 一般地,提起操作会想到“增删改查”这四个字,而DOM节点操作也类似地对应于此,接下来将详细介绍DOM的节 ...
随机推荐
- BFM模型介绍及可视化实现(C++)
BFM模型介绍及可视化实现(C++) BFM模型基本介绍 Basel Face Model是一个开源的人脸数据库,其基本原理是3DMM,因此其便是在PCA的基础上进行存储的. 目前有两个版本的数据库( ...
- swift 手机号、邮箱、网址等正则表达式验证
看到一个不错的swift的 手机号.邮箱.网址等正则表达式验证,分享给大家. 支持swift3,经过修改后,亲测可用! import Foundation enum Validate { case e ...
- 《Effective Java》 读书笔记(八)避免使用Finalizer和Cleaner机制
Finalizer和Cleaner并不等同于C++中的析构函数,是不确定多久会被调用的,甚至有时候可能不会被调用,因此除了作为一个安全网或者终止非关键的本地资源,不应该在Finalizer或Clean ...
- .NET进阶篇06-async异步、thread多线程1
知识需要不断积累.总结和沉淀,思考和写作是成长的催化剂 异步多线程挺大一块内容,既想拆开慢慢学,又想一股脑全倒出.纠结再三,还是拆开吃透,也不至于篇幅过长,劝退许多人 本篇先做一个概述,列明一些基本概 ...
- 文字转换为svg动画
将输入文本根据使用字体转化为描边动画. 详情请看git https://oubenruing.github.io/svg-text-animate/
- Scrapy进阶知识点总结(五)——Settings
1.设置优先级 Scrapy中有不同层次的设置,其类型以及优先级如下(从高到低): 1.命令行命令中指定的设置 2.每个spider中的设置 3.scrapy项目中settings.py设置 4.命令 ...
- 201871010114-李岩松《面向对象程序设计(java)》第十周学习总结
项目 内容 这个作业属于哪个课程 https://www.cnblogs.com/nwnu-daizh/ 这个作业的要求在哪里 https://www.cnblogs.com/nwnu-daizh/p ...
- PowerDesigner列名、注释内容互换
资料来源:PowerDesigner列名.注释内容互换 文中一共提供了2种操作的代码. (1)将Name中的字符COPY至Comment中 (2)将Comment中的字符COPY至Name中 使用方法 ...
- Electron 菜单切换主题与css替换 ts编写
////目标css<link rel="stylesheet" id="theme_css" href="路径"> ////ts ...
- W与V模型的联系与区别
很多小白一定要注意: 看准那个是开发的工作哪个是测试的工作,不要弄混了!!! 软件测试的V模型 以“编码”为黄金分割线,将整个过程分为开发和测试,并且开发和测试之间是串行的关系 ...