Question

HTML

<div>
 <span class="openParen bm0">(</span>
 <span class="closeParen bm0">)</span>
 <span class="openParen bm3">(</span>
 <span class="openCurly bm1">{</span>
 <span class="openParen bm2">(</span>
 <span class="closeParen bm2">)</span>
 <span class="closeParen bm3">)</span> 
 <span class="closeCurly bm1">}</span>
</div>

更新我希望使用bm classname将它包装在<span class="new"></span>中，我只想将Paren包含在他们的类名中

没有正确包装

<div>
  <div>if<span class="openParen bm1">(</span>b<3 && b>0<span class="closeParen bm1">)</span>{</div>
</div>

Answer 1

您可以使用.wrapAll()并使用bm0类来选择元素

var ops = /(==|<=|>=|!=|>|<)/,
    prev = /(if|else\s+if|while|for)/;
$('.openParen').each(function () {
    var bm = this.className.match(/\b(bm\d+)\b/)[1],
        $this = $(this),
        $close = $('.closeParen.' + bm);

    var $set = $(this),
        next = this.nextSibling;
    while (next) {
        $set = $set.add(next);
        if ($close.is(next)) {
            break;
        }
        next = next.nextSibling;
    }

    if (ops.test($set.text())) {
        var prevEl = this.previousSibling;
        var $span = $set.wrapAll('<span class="new"></span>').parent();
        if (prevEl && prevEl.nodeType == 3 && prev.test($(prevEl).text())) {
            $span.prepend(prevEl)
        }
    }
})

演示：Fiddle

Answer 2

这段代码应该可以解决问题：

$.each($('.openParen'), function(index, startParen){
    var classes = $(startParen).attr('class').split(' ');
    var bmClass = $.grep(classes, function(thisElement, index){
        return thisElement.toString().match("^bm");
    });
    $(startParen).nextUntil($('.' + bmClass[0])).andSelf().add($('.' + bmClass[0] +     ':last')).wrapAll('<span class="new"></span>');
});

说明：

选择类“openParen”的所有元素。

循环浏览此列表并获取每个关联的“.bm”类。

var bmClass = $.grep(classes, function(thisElement, index){
        return thisElement.toString().match("^bm");
    });

此代码获取以关键字“bm”开头的类名。
现在从当前元素开始选择所有元素，直到具有所需“bm”类的下一个元素。
```
$(startParen).nextUntil($('.' + bmClass[0]))
```
将当前和最终的“bm”元素添加为jquery，nextUntil（）不会将它们添加到包装集中。
```
$(startParen).nextUntil($('.' + bmClass[0])).andSelf().add($('.' + bmClass[0] + ':last'))
```

用标签包裹该套装。

$(startParen).nextUntil($('.' + bmClass[0])).andSelf().add($('.' + bmClass[0] + ':last')).wrapAll('<span class="new"></span>');

就是这样。现在你的跨度为“paren”关键字很好地包含在外部跨度中，类为“new”。也根据相应的“bm”类进行分组。
现在我们需要做的只是在dom load事件中包含此代码，我们就完成了。

选择具有两个类并包装它们的元素

2 个答案: