easy

DocsVersion : 1.0.0

after( content, [ args... ] )

原型方法Define in : node.js

向每个匹配元素之后插入内容。如果要向匹配元素之前插入内容,请使用 before

参数
  • 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' ).after( '<p>paragraph1</p>' );

运行

例子2

将 span 插入到 a 标签的后面,参数是 DOM 元素。

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

运行

例子3

将 span 插入到 a 标签的后面,参数是 easyJS Object。

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

运行

例子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( '#demoList2 dd:last-child' ).after( E.query('#demoList1 dd') );pre>
        

运行

例子5

将 span、em、a 一次性插入到 div 的后面,多个参数同时插入。

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

运行

查看其它 DOM 元素的插入方法
afterToprototype
appendprototype
appendToprototype
beforeprototype
beforeToprototype
prependprototype
prependToprototype