无涯教程-jQuery - wrapInner( elem )方法函数

发布人：shili8 发布时间：2025-03-07 19:30 阅读次数：0

**jQuery 无涯教程 - wrapInner() 方法**

在 jQuery 中，`wrapInner()` 方法用于将一个 HTML 元素的内容包裹在另一个元素中。这个方法非常有用，当你需要为某个元素添加额外的结构或样式时。

###什么是 `wrapInner()` 方法？

`wrapInner()` 方法接受一个选择器作为参数，用于指定要包裹的 HTML 元素。该方法会将选中的元素内容包裹在一个新创建的元素中，并返回这个新元素。

### 使用示例#### 示例1：简单包裹

html<div id="example">
 <p>Hello, World!</p>
</div>

<script>
 $("#example").wrapInner("<div></div>");
</script>

在上面的示例中，我们使用 `wrapInner()` 方法将 `#example` 元素的内容包裹在一个新创建的 `

` 元素中。

#### 示例2：包裹并添加样式

html<div id="example">
 <p>Hello, World!</p>
</div>

<script>
 $("#example").wrapInner("<div style='background-color: #f0f0f0; padding:10px;'></div>");
</script>

在这个示例中，我们使用 `wrapInner()` 方法将 `#example` 元素的内容包裹在一个新创建的 `

` 元素中，并为该元素添加样式。

#### 示例3：包裹并追加类

html<div id="example">
 <p>Hello, World!</p>
</div>

<script>
 $("#example").wrapInner("<div class='new-class'></div>");
</script>

在这个示例中，我们使用 `wrapInner()` 方法将 `#example` 元素的内容包裹在一个新创建的 `

` 元素中，并为该元素追加类 `new-class`。

###代码注释

javascript// 包裹 #example 元素的内容$("#example").wrapInner("<div></div>");

// 包裹并添加样式$("#example").wrapInner("<div style='background-color: #f0f0f0; padding:10px;'></div>");

// 包裹并追加类$("#example").wrapInner("<div class='new-class'></div>");

### 总结`wrapInner()` 方法是 jQuery 中一个非常有用的方法，它可以将 HTML 元素的内容包裹在另一个元素中。这个方法可以用于添加额外的结构或样式，或者追加类等功能。

### 最后希望本篇教程对你有所帮助。如果你有任何问题，请随时联系我。

上一条：C#删除字符串指定字符

下一条：cocosCreator 之 Button

相关标签：前端 jquery javascript ecmascript

其他信息

其他资源