jQuery 添加 HTML

简介

jQuery 是一个流行的 JavaScript 库，它简化了操作 HTML 文档的过程。其中，添加 HTML 元素或内容是 jQuery 常用功能之一。

多级标题

使用 append() 方法

append() 方法用于在选定元素的末尾添加 HTML 内容。语法如下：``` $(selector).append(htmlString); ```

例子：

``` $("body").append("

这是一段新添加的段落。

"); ```

使用 prepend() 方法

prepend() 方法与 append() 类似，但它将 HTML 内容添加到选定元素的开头。语法如下：``` $(selector).prepend(htmlString); ```

例子：

``` $("body").prepend("

这是新添加的标题

"); ```

使用 after() 方法

after() 方法在选定元素之后插入 HTML 内容。语法如下：``` $(selector).after(htmlString); ```

例子：

``` $("p").after("
"); ```

使用 before() 方法

before() 方法与 after() 类似，但它在选定元素之前插入 HTML 内容。语法如下：``` $(selector).before(htmlString); ```

例子：

``` $("p").before("加粗文本"); ```

使用 html() 方法

html() 方法替换选定元素中的所有 HTML 内容。语法如下：``` $(selector).html(htmlString); ```

例子：

``` $("body").html("

"); ```

内容详细说明

上述方法都可以用于向 HTML 文档添加各种内容，包括：

文本内容

HTML 元素

表格

列表

图像需要注意的是，htmlString 参数必须是有效的 HTML 代码。

结论

jQuery 提供了多种添加 HTML 内容的方法，从而简化了 DOM 操作。通过使用这篇文章中讨论的方法，你可以轻松地向你的 web 页面添加新元素或内容。

**jQuery 添加 HTML****简介**jQuery 是一个流行的 JavaScript 库，它简化了操作 HTML 文档的过程。其中，添加 HTML 元素或内容是 jQuery 常用功能之一。**多级标题****使用 append() 方法**append() 方法用于在选定元素的末尾添加 HTML 内容。语法如下：``` $(selector).append(htmlString); ```**例子：**``` $("body").append("

这是一段新添加的段落。

"); ```**使用 prepend() 方法**prepend() 方法与 append() 类似，但它将 HTML 内容添加到选定元素的开头。语法如下：``` $(selector).prepend(htmlString); ```**例子：**``` $("body").prepend("

这是新添加的标题

"); ```**使用 after() 方法**after() 方法在选定元素之后插入 HTML 内容。语法如下：``` $(selector).after(htmlString); ```**例子：**``` $("p").after("
"); ```**使用 before() 方法**before() 方法与 after() 类似，但它在选定元素之前插入 HTML 内容。语法如下：``` $(selector).before(htmlString); ```**例子：**``` $("p").before("加粗文本"); ```**使用 html() 方法**html() 方法替换选定元素中的所有 HTML 内容。语法如下：``` $(selector).html(htmlString); ```**例子：**``` $("body").html(""); ```**内容详细说明**上述方法都可以用于向 HTML 文档添加各种内容，包括：* 文本内容 * HTML 元素 * 表格 * 列表 * 图像需要注意的是，htmlString 参数必须是有效的 HTML 代码。**结论**jQuery 提供了多种添加 HTML 内容的方法，从而简化了 DOM 操作。通过使用这篇文章中讨论的方法，你可以轻松地向你的 web 页面添加新元素或内容。