一、方法
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" >
< 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").wrapInner("< 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").wrapInner("< 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 >