推荐在每个匹配元素的外部插入新元素的方法
发布时间：2023-08-31 14:22:51 所属栏目：教程 来源：
导读：一、方法
wrap ：把所有匹配的元素，用其他元素的结构化包裹起来
wrapAll : 把所有匹配的元素，用单个元素包裹起来
wrapInner : 把匹配元素的子类用html结构包裹起来
二、实例
（1）wrap
代
wrap ：把所有匹配的元素，用其他元素的结构化包裹起来
wrapAll : 把所有匹配的元素，用单个元素包裹起来
wrapInner : 把匹配元素的子类用html结构包裹起来
二、实例
（1）wrap
代
|
一、方法 wrap ：把所有匹配的元素，用其他元素的结构化包裹起来 wrapAll : 把所有匹配的元素，用单个元素包裹起来 wrapInner : 把匹配元素的子类用html结构包裹起来 二、实例 （1）wrap 代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script type="text/javascript" src="../jquery-2.0.0/jquery-2.0.0.js"></script> <script type="text/javascript"> $(function() { $("div a").wrap("<div id='id'></div>"); }); </script> </head> <body> <div> <a>liuxingyu</a> <a>liuxingyu</a> <a>liuxingyu</a> <a>liuxingyu</a> </div> </body> </html> firebug显示结果： 代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script src="../jquery-2.0.0/jquery-2.0.0.js" type="text/javascript"> <script type="text/javascript"> </head> <body> <div> <div id="id"> <a>liuxingyu</a> </div> <div id="id"> <a>liuxingyu</a> </div> <div id="id"> <a>liuxingyu</a> </div> <div id="id"> <a>liuxingyu</a> </div> </div> </body> </html> （2）wrapAll 代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script type="text/javascript" src="../jquery-2.0.0/jquery-2.0.0.js"></script> <script type="text/javascript"> $(function() { $("div a").wrapAll("<div id='id'></div>"); }); </script> </head> <body> <div> <a>liuxingyu</a> <a>liuxingyu</a> <a>liuxingyu</a> <a>liuxingyu</a> </div> </body> </html> firebug显示结果： 代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script src="../jquery-2.0.0/jquery-2.0.0.js" type="text/javascript"> <script type="text/javascript"> $(function() { $("div a").wrapAll("<div id='id'></div>"); }); </script> </head> <body> <div> <div id="id"> <a>liuxingyu</a> <a>liuxingyu</a> <a>liuxingyu</a> <a>liuxingyu</a> </div> </div> </body> </html> （3）wrapInner 代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> （编辑：聊城站长网） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |
推荐文章
站长推荐
