1

我偶然发现了 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 wrap 的误解？

提前致谢！

4

1 回答 1

3

按预期工作，您wrapper1将是被包裹的主要对象，content1并且由于您尚未关闭innerwrapper1，jquery 会为您关闭它。如果要使用内部包装器进行包装，则将其设为对象，包装内容，然后将内部包装器附加到包装器：

var wrapper1 = $('<div class="wrap1">something in between</div>'),
    innerWrapper = $('<div class="innerwrap1" />');

$('.content1').wrap(innerWrapper);    
wrapper1.append($('.innerwrap1'));

例子

于 2013-08-06T15:05:03.620 回答