Обернуть подстроку содержимого элемента элементом, используя jQuery

У меня есть список ссылок, разделенных запятыми:

<a href="#">link</a>,
<a href="#">link</a>,
<a href="#">link</a>,
<a href="#">link</a>,
<a href="#">link</a>,
<a href="#">link</a>
<div></div>

Теперь я хотел бы обернуть ссылки с позиции 3 до последней так, чтобы это выглядело так:

<a href="#">link</a>,
<a href="#">link</a>,
<span>
<a href="#">link</a>,
<a href="#">link</a>,
<a href="#">link</a>,
<a href="#">link</a>
</span>
<div></div>

Я попробовал это так:

$("a").eq(1).nextUntil("div").wrapAll('<span>');

Однако это не оборачивает запятые, и результат выглядит следующим образом:

<a href="#">link</a>,
<a href="#">link</a>,
<span>
<a href="#">link</a>
<a href="#">link</a>
<a href="#">link</a>
<a href="#">link</a>
</span>
,,,
<div></div>

Как я могу включить запятые во вложении?

Демо: http://jsfiddle.net/aa9GJ/1/

2 ответа

Решение

Хорошо, я наконец что-то понял. Вы выбираете первый элемент внутри диапазона, который хотите, а затем анализируете DOM и самостоятельно создаете массив элементов, а не позволяете jQuery это делать. Затем вы можете обернуть массив, как вы сделали, и он будет включать в себя запятые...

$("a").eq(2).each(function(){
    var $elements = $(this);
    var next = this.nextSibling;
    while (next) {
        if ($(next).is("div")) {
            break;
        } else {
            $elements.push(next);
            next = next.nextSibling;
        }
    } 
   $elements.wrapAll('<span>');
});

Рабочий пример jsfiddle...

Попробуй это:

$("a").eq(1).nextUntil("div").wrapAll('</a>');

если это то, что вы хотите - я верю, что вы хотите это после каждого списка правильно??

Другие вопросы по тегам