wrap_jQuery wrap()的用法

发布时间:2021-06-23 发布网站:前端之家 F2er.com
前端之家收集整理的这篇文章主要介绍了wrap_jQuery wrap()的用法前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

概述

jQuery中wrap()用于把所有匹配的元素用其他元素的结构化标记包裹起来。

这种包装对于在文档中插入额外的结构化标记最有用,而且它不会破坏原始文档的语义品质。这个函数的原理是检查提供的第一个元素(它是由所提供的html标记代码动态生成的),并在它的代码结构中找到最上层的祖先元素,这个祖先元素就是包裹元素。当html标记代码中的元素包含文本时无法使用这个函数。因此,如果要添加文本应该在包裹完成之后再行添加。

定义和用法

wrap() 方法把每个被选元素放置在指定的 HTML 内容或元素中。

语法

$(selector).wrap(wrapper)参数描述wrapper必需。规定包裹被选元素的内容。

可能的值:

HTML 代码 - 比如 ("<div></div>")新元素 - 比如 (document.createElement("div"))已存在的元素 - 比如 ($(".div1"))已存在的元素不会被移动,只会被复制,并包裹被选元素。

示例

html参数描述:

把所有的段落用一个新创建的div包裹起来

jQuery 代码:
$("p").wrap("<div></div>");

elem参数描述:

用ID是"content"的div将每一个段落包裹起来

jQuery 代码:
$("p").wrap(document.getElementById('content'));

回调函数 描述:

用原先div的内容作为新div的class,并将每一个元素包裹起来

HTML 代码:
<div>

<div>Hello</div>

<div>Goodbye</div>

</div>

jQuery 代码:
$('.inner').wrap(function() {

return '<div + $(this).text() + '" />';

});

结果:
<div>

<div>

<div>Hello</div>

</div>

<div>

<div>Goodbye</div>

</div>

</div>

总结


以上是前端之家为你收集整理的wrap_jQuery wrap()的用法全部内容,希望文章能够帮你解决wrap_jQuery wrap()的用法所遇到的程序开发问题。

如果觉得前端之家网站内容还不错,欢迎将前端之家网站推荐给前端开发程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。