使用 jQuery 从 X 包装到 Y 项目 [关闭]答案

【问题标题】：Wrap from X to Y items using jQuery [closed]使用 jQuery 从 X 包装到 Y 项目 [关闭]
【发布时间】：2019-04-26 16:33:17
【问题描述】：

http://jsbin.com/uxepap/17/edit

如何将所有链接从第三个到最后一个用一个<span class="wrap"></span>包装？

尝试进行修复，如果可行，链接将位于带有填充的红色背景上。

注意：它应该是a_items var 中的包装器，然后由.html(); 显示

到目前为止，还没有可行的解决方案。

【问题讨论】：

您的演示在链接上有display: block。内联元素中不能有块元素。这是一个示例，说明为什么在问题中发布相关代码会有所帮助。
你说的 是什么意思？应该是 links var 中的包装器，然后才显示..."？元素在 DOM 中。如果您包装元素，它们将被包装在 DOM 中，而与变量无关。根本没有理由使用.html()。
排序克隆链接
关键是你的问题并不清楚你想要什么。当 CSS 正确时，以下解决方案会正确显示。如果这不是问题，并且您实际上想要包装元素的克隆，而不是元素本身，那么您应该将其放在问题中。说真的，你是在寻找解决方案的人。您应该接受 cmets。您的问题缺少当前形式的信息。
@Steve 你最好一步一步地解释你想要什么。这个问题可能会因为含糊而关闭。

标签： javascript jquery html filter

【解决方案1】：

$('a:gt(2)').wrap('<span/>');

DEMO 1

或

var links = $('a');
var last = links.filter(':gt(2)');
last.wrap('<span/>');

DEMO 2

根据编辑

$('div a').map(function(index, item) {
    if(index > 2) {
        return $(item).wrap('<span class="wrap"/>').get(0)
    } else return $(item);
});

DEMO 3

【讨论】：

它应该与 'links' var 一起使用
@Steve 检查DEMO 2 和links var
链接应该被包裹在 'links' 变量中，因为我们在包裹之后才显示它们。
这应该存在，因为排序
jsfiddle.net/tkpQ6/3 这样不行，.wrap 里面没有链接

【解决方案2】：

.wrap 包装每个元素。使用wrapAll 包装一组元素：

last.wrapAll('<span></span>');

【讨论】：

也许我不明白你到底想达到什么目的

【解决方案3】：

var links = $('a').slice(2, $('a').length);
    links.wrap('<span/>');

【讨论】：

切片的结束索引是可选的，默认为结束
它应该被包裹在 在 var 中，而不是马上
@Steve：这没有任何意义。这些元素当前位于 DOM 中。你怎么能只从变量引用中包装它们而不实际将它们包装在 DOM 中？
如果没有意义，为什么它不起作用？例子？
@Steve：这里的大多数答案都有效。您是否费心阅读我在您的问题下留下的第一条评论？

【解决方案4】：

jQuery 有slice() 过滤你的选择，从选定的开始索引到选定的、可选的结束索引。

Here's a sample.

var last = $('a')       //store them in last
    .slice(2)           //get third to last
    .remove()           //remove them from the DOM
    .wrap('<span>');    //wrap them in span

【讨论】：

不起作用jsbin.com/uxepap/11/edit
链接应该被包裹在 'links' 变量中，我们在包裹之后显示它们（替换当前链接）
请看注释.. 它不应该被立即包装，而是我们将它们包装在 inside var 并在需要时显示..
@Steve “不立即包装”是什么意思？您可以稍后使用函数包装它们。你的意思是说从 DOM 中取出第三个到最后一个并将它们存储在一个变量中，包装好以后再显示？
请参阅jsbin.com/uxepap/17/edit，这不适用于我的代码