replaceChild(a,b)是用来替换文档中的已有元素的
参数a:要插入的节点,
参数b:要替换的节点

var oDiv = document.getElementById("guoDiv");
var oSpan = document.createElement("span");
oSpan.innerHTML = "4";
var firsChild = oDiv.firstElementChild ? oDiv.firstElementChild : oDiv.firstChild
var returnNode = oDiv.replaceChild(oSpan, firsChild); //替换第一个元素,返回被替换掉的元素
alert(returnNode.innerHTML); //
var lastChild = oDiv.lastElementChild ? oDiv.lastElementChild : oDiv.lastChild;
oSpan = document.createElement("span");
oSpan.innerHTML = "5";
returnNode = oDiv.replaceChild(oSpan, lastChild); //替换最后一个,返回被替换掉的元素
alert(returnNode.innerHTML);//
<div id="guoDiv">
<span>1</span>
<span>2</span>
<span>3</span>
</div>

javascript节点操作replaceChild()的更多相关文章

  1. JavaScript 节点操作Dom属性和方法(转)

    JavaScript 节点操作Dom属性和方法   一些常用的dom属性和方法,列出来作为手册用. 属性:   1.Attributes 存储节点的属性列表(只读)   2.childNodes 存储 ...

  2. 【转】JavaScript 节点操作 以及DOMDocument属性和方法

    最近发现DOMDocument对象很重要,还有XMLHTTP也很重要 注意大小写一定不能弄错. 属性: 1Attributes 存储节点的属性列表(只读) 2childNodes 存储节点的子节点列表 ...

  3. JavaScript -- 节点操作, 事件触发, 表单伸缩

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

  4. javascript 节点操作拷贝节点cloneNode()

    cloneNode(a)方法接受一个布尔值参数,表示是否深拷贝 true:表示执行深拷贝,复制本节点以及整个子节点树. false:浅拷贝.只复制节点本身. 复制后返回的节点副本属于文档所有,但是并没 ...

  5. javascript节点操作appendChild()

    cloneNode(a)方法接受一个布尔值参数,表示是否深拷贝 true:表示执行深拷贝,复制本节点以及整个子节点树. false:浅拷贝.只复制节点本身. 复制后返回的节点副本属于文档所有,但是并没 ...

  6. javascript节点操作移出节点removeChild()

    removeChild(a)是用来删除文档中的已有元素 参数a:要移出的节点 <div id="guoDiv"> <span>1</span> ...

  7. javascript节点操作insertBefor()

    如果想要把节点放在某个特定的位置,而不是放在末尾,就可以使用insertBefore(a,b) 参数a:要插入的节点 参数b:作为参照的节点. var oDiv = document.getEleme ...

  8. JS节点操作(JS原生+JQuery)

    JavaScript与JQuery节点操作   节点关系与类型 任何HTML元素,都有nodeType属性.值有1~12,常用的有: 1.元素节点 2.文本节点 8.注释节点 9.document节点 ...

  9. javaScript之节点操作

    javaScript程序员避免不了要操作页面中的DOM,除了经常使用的: appendChild()向childNodes列表的末尾添加一个节点. insertBefore(),接受两个参数,要插入的 ...

随机推荐

  1. koa 微信小程序 项目

    这个微信号入门, 应该能自己模仿做一个微信公众号了 另外 微信小程序开发 和 微信公众号h5嵌入 还是有区别的 h5嵌入在体验上和 微信小程序 差距还是比较大, 因为小程序直接调用了微信的原生组件, ...

  2. Bootstrap CustomBox 弹层

    这个模态窗口插件使用原生javascript制作,它也可以和jQuery完美的结合.请注意:这些模态窗口动画仅仅工作在支持各自CSS3属性的浏览器上.Internet Explorer 8 和 9需要 ...

  3. UI基础:视图控制器.屏幕旋转.MVC 分类: iOS学习-UI 2015-07-02 22:21 62人阅读 评论(0) 收藏

    UIViewController 视图控制器,继承自UIResponder,作用:管理视图并且响应事件 功能: 1.分担APPdelegate的工作 2.实现模块独立,能提高复用性 创建UIViewC ...

  4. Xcode C++ and Objective-C refactoring

    Is there a way to refactor mixed C++/Objective-C code in Xcode ?? I am writing a game using Cocos2D ...

  5. C语言中右大括号(})后是否加分(;)号问题

    在C语言中定义结构体时,右大括号后是需要加分号的,在C++中使用class关键字定义类时,右大括号后也是需要加分号的,而在定义函数时,右大括号后是不需要加分号的. 对这个问题的解释就是右花括号}能代表 ...

  6. error: QXcbConnection: Could not connect to display

    /********************************************************************************* * error: QXcbConn ...

  7. linux中grep用法(“或”、“与”)

    1.普通用法 grep keyword 若果keyword中有空格 grep "keyword" 例如: ls | grep mp4 2.“与”操作(其实就是多次筛选) grep ...

  8. 2243: [SDOI2011]染色(LCT)

    2243: [SDOI2011]染色 Time Limit: 20 Sec  Memory Limit: 512 MBSubmit: 10909  Solved: 4216[Submit][Statu ...

  9. OVSSL企业证书认证

    最近,在做http->https的转化,虽然我没有操作证书的安装过程,但是在这个过程中学习到不少知识呢. 因为我没有操作,所以操作上我就不知道了.下面是这个过程中要注意的一些事项: 1.公司名称 ...

  10. HDU 6188:Duizi and Shunzi(贪心)(广西邀请赛)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=6188 题意 有n个数字,每个数字小于等于n,两个相同的数字价值为1,三个连续的数字价值为1 .问这n个 ...