MDN wants to talk to developers like you: https://qsurvey.mozilla.com/s3/8d22564490d8

ChildNode.after()

这是一个实验中的功能
此功能某些浏览器尚在开发中,请参考浏览器兼容性表格以得到在不同浏览器中适合使用的前缀。由于该功能对应的标准文档可能被重新修订,所以在未来版本的浏览器中该功能的语法和行为可能随之改变。

在其父节点的子节点列表中插入一些 Node 或 DOMString 对象。插入位置为该节点之后。DOMString 对象会被以 Text 的形式插入。

语法

[Throws, Unscopable] 
void ChildNode.after((Node or DOMString)... nodes);

参数

nodes
一组准备插入的 Node 或 DOMString

例外情况

示例

插入元素

var parent = document.createElement("div");
var child = document.createElement("p");
parent.appendChild(child);
var span = document.createElement("span");

child.after(span);

console.log(parent.outerHTML);
// "<div><p></p><span></span></div>"

插入文本

var parent = document.createElement("div");
var child = document.createElement("p"); 
parent.appendChild(child);

child.after("Text"); 

console.log(parent.outerHTML);
// "<div><p></p>Text</div>"

同时插入元素和文本

var parent = document.createElement("div");
var child = document.createElement("p"); 
parent.appendChild(child); 
var span = document.createElement("span");

child.after(span, "Text"); 

console.log(parent.outerHTML);
// "<div><p></p><span></span>Text</div>"

ChildNode.after() 会被 with 环境排除

after() 方法不在 with 环境的范围内,可以查看 Symbol.unscopables 来了解更多信息。

with(node) { 
  after("foo");
}
// ReferenceError: after is not defined 

规范

Specification Status Comment
DOM
ChildNode.after()
Living Standard Initial definition.

浏览器兼容性

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support 54.0 49 (49) ? 39.0 ?
Feature Android Android Webview Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile Chrome for Android
Basic support 未实现 54.0 49.0 (49) ? 39.0 ? 54.0

相关链接

文档标签和贡献者

 此页面的贡献者: Cattla
 最后编辑者: Cattla,