HTML - DOM文档adoptNode()方法



HTML DOM adoptNode() 方法将一个节点从另一个文档中采用到当前文档中。所有节点都可以使用 adoptNode() 方法采用,包括父节点和子节点。

  • 使用 adoptNode() 方法时,节点及其子节点将从其原始文档中移除。
  • 节点的 ownerDocument 属性将更改为当前文档。
  • 现在可以将已采用的节点插入到当前文档中。

语法

document.adoptNode(node);

参数

HTML DOM Document adoptNode() 方法接受单个参数,如下所示:

参数 描述
node 它代表您要从另一个 HTML 文档中采用的节点。

返回值

它返回从另一个文档中采用的节点对象。

HTML DOM Document adoptNode() 方法示例

以下示例演示了将 <h1> 从一个网页 (**adoption.htm**) 移动到另一个网页 (**adopted.htm**) 。

这是元素将被采用的页面 (**adoption.htm**) 。

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Adoption file</title>
</head>
<body>
    <h1>I am being adopted</h1>
    <h1>Welcome to TutorialsPoint</h1>
    <h1>This is adoptNode() method tutorial</h1>
</body>
</html>

在这个页面 (**adopted.htm**) 中,将从不同的页面采用元素。

<!DOCTYPE html>
<html lang="en">
<head>
    <title>HTML DOM document adoptNode() Method</title>
</head>
<body>
    
    <iframe src="adoption.htm"  style="height: 400px; width: 400px"></iframe>
    <button onclick="fun()">Click me</button>
    <script>
        function fun(){
            let frame =document.getElementsByTagName("iframe")[0];
            let adopted_ele=frame.contentWindow.document.getElementsByTagName("h1")[0];
            let result=document.adoptNode(adopted_ele);
            document.body.appendChild(result);
        }
    </script>
</body>
</html>

支持的浏览器

方法 Chrome Edge Firefox Safari Opera
adoptNode() 是 1 是 12 是 1 是 3 是 12.1
广告