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())的更多相关文章

  1. 替换元素节点replaceChild()

    替换元素节点replaceChild() replaceChild 实现子节点(对象)的替换.返回被替换对象的引用. 语法: node.replaceChild (newnode,oldnew ) 参 ...

  2. JavaScript---Dom树详解,节点查找方式(直接(id,class,tag),间接(父子,兄弟)),节点操作(增删改查,赋值节点,替换节点,),节点属性操作(增删改查),节点文本的操作(增删改查),事件

    JavaScript---Dom树详解,节点查找方式(直接(id,class,tag),间接(父子,兄弟)),节点操作(增删改查,赋值节点,替换节点,),节点属性操作(增删改查),节点文本的操作(增删 ...

  3. jQuery之替换节点

    如果要替换节点,jQuery提供了两个方法:replaceWith()和replaceAll(). 两个方法的作用相同,只是操作颠倒了. 作用:将所有匹配的元素都替换成指定的HTML或者DOM元素.( ...

  4. jQuery中的查找节点、创建节点、插入节点、删除节点、替换节点、复制节点操作方法

    jQuery操作节点我们可以分六点来讲,查找节点.创建节点.插入节点.删除节点.替换节点.复制节点. 一.查找节点 text() - 设置或返回所选元素的文本内容   ,html() - 设置或返回所 ...

  5. 替换节点及replaceEach方法

    需求: 为所有的 li 节点添加 onclick 响应函数实现 city 子节点和 game 子节点对应位置的元素的互换 window.onload = function(){ //自定义互换两个节点 ...

  6. JQ 替换节点

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. jquery 替换节点实例

    描述: 要求用户选择一个自己不喜欢的商品 说明: 左边是商品列表,右面显示用户不喜欢的商品. 首先用选择器获得用户点击的元素,然后替换右面用户选择的不喜欢的商品. <!doctype html& ...

  8. [UE4]蓝图替换节点、引用快捷方式

  9. 深入理解DOM节点操作

    × 目录 [1]创建节点 [2]插入节点 [3]移除节点[4]替换节点[5]复制节点 前面的话 一般地,提起操作会想到“增删改查”这四个字,而DOM节点操作也类似地对应于此,接下来将详细介绍DOM的节 ...

随机推荐

  1. Windows下NFS服务器SFU设置(可以共享linux系统)

    一.安装SFU1.下载软件SFU http://download.microsoft.com/download/a/1/c/a1ca7af1-a6e3-46e7-874a-4c5d8c0fb3b7/S ...

  2. 怎么用Vuecli 3.0快速创建项目

    一.安装 1.安装node.js,这里需要注意的是,Vue CLI 3需要 nodeJs ≥ 8.9,所以我们去中文官方下载地址:http://nodejs.cn/download/,下载最新版本即可 ...

  3. 练习Markdown基本语法

    这是一级标题 二级标题 三级标题 我就说一点(数字+英文句点.) 第二 在行首增加*或-,就会有下面的效果 嘿 嘿 嘿 这一部分是插入图片和引用 插入图片 用感叹号+[]+括号 直接复制粘贴~ 引用 ...

  4. 第三十章 System V信号量(一)

    信号量 信号量和P.V原语由Dijkstra(迪杰斯特拉)提出 信号量: 互斥: P.V在同一进程中 同步: P.V在不同进程中 信号量值含义 S>0 : S表示可用资源个数 S=0 : 表示无 ...

  5. Apache Solr Velocity模板远程代码执行复现

    0x01漏洞描述 2019年10月31日,国外安全研究员s00py在Github公开了一个Apache Solr Velocity模板注入远程命令执行的poc. 经过研究,发现该0day漏洞真实有效并 ...

  6. [git]将代码上传到github

    1.右键你的项目,如果你之前安装git成功的话,右键会出现两个新选项,分别为Git Gui Here,Git Bash Here,这里我们选择Git Bash Here,进入如下界面 2.接下来输入如 ...

  7. Pandas常用数据结构

    Pandas 概述 Pandas(Python Data Analysis Library)是基于NumPy 的一种工具,该工具是为了解决数据分析任务而创建的.Pandas 纳入了大量库和一些标准的数 ...

  8. CSPS模拟 95

    T_T flag彻底倒了 虽然打一开始就没觉得能实现过 可是我好桑心T_T skyh那个没素质的还一直bb T_T

  9. csps模拟测试 77爆零反思

    题不算太难,可是我还是没考出应有水平. $1h8min$切掉前两道题,然后$T3$想到正解并且码出来了并且过了大样例并且爆零. 没什么好说的,我太自信了,没打对拍? 想到了正解,还不如随便打个暴力分高 ...

  10. getchar()用法 【转】

    1.从缓冲区读走一个字符,相当于清除缓冲区 2.前面的scanf()在读取输入时会在缓冲区中留下一个字符'\n'(输入完s[i]的值后按回车键所致),所以如果不在此加一个getchar()把这个回车符 ...