easy

DocsVersion : 1.0.0

replace( content, [ args... ] )

原型方法Define in : node.js

将匹配元素替换成指定的元素。原理类似 replaceChild。

参数
  • content
    htmlString|
    Element|
    Element Array|
    easyJS Object
    必需

    content 可以是 HTML 字符串、DOM 元素、DOM 元素数组、easyJS Object。

  • args...
    htmlString|
    Element|
    Element Array|
    easyJS Object
    可选

    也可以同时替换成多个内容,多个内容同时替换将按照参数本身的顺序依次替换。

返回值
  • easyJS Object

    返回 easyJS Object 便于链式调用。

例子1

在 div 替换成 p 元素,参数是HTML字符串。

box1
<div id="box1">box1</div>
E( '#box1' ).replace( '<p>para1</p>' );

运行

例子2

将 a 元素替换成 span 元素,参数是 DOM 元素。

span link
<span id="demoSpan1">span </span><a href="#" id="demoLink1">link </a>
E( '#demoSpan1' ).replace( E.query('#demoLink1')[0] );

运行

例子3

将 a 元素替换成 span 元素,参数是 easyJS Object。

span link
<span id="demoSpan2">span </span><a href="#" id="demoLink2">link </a>
E( '#demoSpan2' ).replace( E.query('#demoLink2') );

运行

例子4

将 list1 中的最后一个 dd 元素替换成 list2 的 dd 元素,参数是 DOM 元素数组。

list1
dd1
dd2
list2
dd3
dd4
<dl id="demoList1">
    <dt>list1</dt>
    <dd>dd1</dd>
    <dd>dd2</dd>
</dl>
<dl id="demoList2">
    <dt>list2</dt>
    <dd>dd3</dd>
    <dd>dd4</dd>
</dl>
E( '#demoList1 dd:last-child' ).replace( E.query('#demoList2 dd') );

运行

例子5

将 div 中的 p 元素替换成 span、em、a,多个参数同时替换。

span em link

para2

<span id="demoSpan3">span </span><em id="demoEm1">em </em><a href="#" id="demoLink3">link </a>
<div id="box2"><p>para2</p></div>
E( '#box2 p' ).replace( E.query('#demoSpan3'), E.query('#demoEm1'), E.query( '#demoLink3' ) );

运行