在 JavaScript 中使用以下方法截取 HTML:获取 HTML 元素并使用 innerHTML 属性获取其 HTML。使用 document.querySelector() 选择元素并使用 outerHTML 属性获取其 HTML。使用 document.createRange() 和 cloneContents() 方法创建文档范围并克隆其内容。

如何使用 JavaScript 截取 HTML
在 JavaScript 中,可以使用以下方法来截取 HTML:
1. 使用 innerHTML 属性
innerHTML 属性表示 HTML 元素及其子元素的 HTML。要使用 innerHTML 属性截取 HTML,可以使用以下步骤:
立即学习“前端免费学习笔记(深入)”;
- 获取要截取的 HTML 元素。
- 使用
innerHTML属性来获取该元素的 HTML。 - 将截取的 HTML 存储在变量中。
示例:
const html = document.getElementById("my-element").innerHTML;2. 使用 document.querySelector() 和 outerHTML 属性
document.querySelector() 方法可用于选择单个 HTML 元素,outerHTML 属性表示元素与其子元素的 HTML,包括元素本身。要使用此方法截取 HTML,可以使用以下步骤:
- 使用
document.querySelector()方法选择要截取的 HTML 元素。 - 使用
outerHTML属性来获取该元素的 HTML。 - 将截取的 HTML 存储在变量中。
示例:
const html = document.querySelector("#my-element").outerHTML;3. 使用 document.createRange() 和 cloneContents() 方法
document.createRange() 方法可用于创建文档范围,cloneContents() 方法可用于克隆文档范围中的内容。要使用此方法截取 HTML,可以使用以下步骤:
- 使用
document.createRange()方法创建文档范围。 - 使用
selectNodeContents()方法选择要截取的 HTML 元素。 - 使用
cloneContents()方法克隆文档范围中的内容。 - 将克隆的内容存储在变量中。
示例:
const range = document.createRange();
range.selectNodeContents(document.getElementById("my-element"));
const html = range.cloneContents();注意:
上述方法只适用于截取 HTML 元素及其子元素的内容。如果您想要截取整个文档的 HTML,可以使用 document.documentElement.innerHTML 或 document.documentElement.outerHTML 属性。










