我偶然发现了jQuery的wrap()函数。
当我试图包装两个div标签时,它们之间的行为有所不同,它们之间有一些文本,而不是两个div之间没有文本。
jquery的:
var wrapper1 = '<div class="wrap1">something in between<div class="innerwrap1">';
$('.content1').wrap(wrapper1);
var wrapper2 = '<div class="wrap2"><div class="innerwrap2">';
$('.content2').wrap(wrapper2);
生成的HTML是:
<div class="wrap1">
something in between
<div class="innerwrap1"></div> <!-- wtf? -->
<div class="content1">Lorem</div>
</div>
<div class="wrap2">
<div class="innerwrap2">
<div class="content2">Ipsum</div>
</div>
</div>
这是一个小提琴: http://jsfiddle.net/RfJN5/
第一个结果是相当令人惊讶的,不是吗?我认为两个结尾的div应该放在.content1之后,无论div之间是否有任何文本。
当然我知道自己添加关闭div来控制行为更安全,但这是一种错误还是只是对如何使用jQuery包装的误解?
提前致谢!
答案 0 :(得分:3)
按预期工作,wrapper1
将成为content1
的主要对象,并且由于您尚未关闭innerwrapper1
,jquery会为您关闭它。如果你想用内包装器包装然后把它作为一个对象,包装内容然后将内包装器附加到包装器:
var wrapper1 = $('<div class="wrap1">something in between</div>'),
innerWrapper = $('<div class="innerwrap1" />');
$('.content1').wrap(innerWrapper);
wrapper1.append($('.innerwrap1'));