document.importNode

`document.importNode` 是一个 JavaScript 的 DOM 方法，用于复制节点并将其插入到文档中。

具体来说，`importNode` 方法接受两个参数：要复制的节点和一个布尔值。第二个参数表示是否复制节点的子元素。如果为 `true`，则会同时复制节点和其子元素；如果为 `false`，则只会复制节点本身而不会复制其子元素。

例如，可以使用以下代码复制一个 `div` 元素并将其插入到文档中：

const div = document.createElement('div');
div.textContent = 'Hello, world!';

const copy = document.importNode(div, true);
document.body.appendChild(copy);

在上面的代码中，首先创建了一个 `div` 元素，并设置其文本内容为 `'Hello, world!'`。然后使用 `document.importNode` 方法将该元素复制，并将复制后的元素插入到文档的 `body` 元素中。

需要注意的是，使用 `importNode` 方法复制的节点并不会被自动插入到文档中，需要手动将其插入到文档中。此外，复制的节点是一个全新的节点，与原节点没有任何关联。

相关问题

js importNode

在 JavaScript 中，importNode() 方法用于从一个文档中导入节点，并将其插入到当前文档中。该方法是 Document 对象的一个方法，可以使用以下语法调用：

importedNode = document.importNode(externalNode, deep)

其中，importedNode 是从外部文档导入的节点，externalNode 是要导入的外部节点，deep 是一个布尔值，表示是否深度导入子节点。

例如，假设我们有两个 HTML 文档：source.html 和 target.html。我们想要从 source.html 中导入一个 div 元素并将其插入到 target.html 的 body 元素中，可以使用 importNode() 方法来实现：

// 获取外部文档
var externalDoc = document.getElementById("source").contentDocument;

// 获取外部文档中的节点
var externalNode = externalDoc.getElementById("myDiv");

// 导入节点并插入到当前文档中
var importedNode = document.importNode(externalNode, true);
document.body.appendChild(importedNode);

在上面的示例中，我们使用了 getElementById() 方法来获取外部文档中的节点，然后使用 importNode() 方法将该节点导入到当前文档中，并最终通过 appendChild() 方法将其插入到当前文档的 body 元素中。

请注意，importNode() 方法只会导入节点本身和它的属性，而不会导入节点的事件处理程序或其他附加数据。

bootstrap5怎么使用template标签

Bootstrap 5 中的 template 标签可以用来定义一个模板，该模板可以在页面中多次使用。使用方法如下：

1. 在 HTML 文件中，使用 template 标签定义模板，例如：

<template id="my-template">
  <div class="card">
    <div class="card-body">
      <h5 class="card-title">Card title</h5>
      <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
      <a href="#" class="btn btn-primary">Go somewhere</a>
    </div>
  </div>
</template>

2. 在 JavaScript 中，使用 document.importNode 方法将模板导入到页面中，例如：

const template = document.querySelector('#my-template');
const clone = document.importNode(template.content, true);
document.body.appendChild(clone);

这样就可以在页面中使用该模板了。