jQuery each() 的替代方案 - 自学问题

Posted 2023-05-09

【中文标题】jQuery each() 的替代方案 - 自学问题

【英文标题】：Alternative to jQuery each() - self educational question

【发布时间】：2011-11-07 17:15:34

【问题描述】：

看看这个

get value of inside a tag with jQuery.?

<span>
 <b>hi_1</b>
 <b>hi_2</b>
 <b>hi_3</b>
 <b>hi_4</b>
<span>

问题在于获取标签内容的逗号分隔字符串

解决方案是在 each 内部推动。

是否有更短（可能更快）的方式使用例如

$("span b").text().join(",") 这当然行不通，因为 text() 不返回数组...

更新：

artyom 发布的“错误报告”（功能请求）有这个相当有趣的 sn-p

var x = $("span b").map(function() 
  return $(this).text();
).toArray().join(", "); 

这类似于 BrokenGlass 的解决方案，但更短......

http://jsfiddle.net/mplungjan/M42Qx/

我更喜欢 toArray 一个...

【参考方案1】：

这可能是作弊，但由于<b> 标记之外没有任何文本，您可以简单地使用$('span').text() 获取<span> 的内部文本并使用它来代替...

$.trim($('span').text()) // Trim newlines near <span> and </span> tags
 .replace(/\s+/g, ', '); // Replace all other whitespace between <b></b> with ,

【讨论】：

但是它不会删除换行符！

@mplungjan：糟糕——我修好了。

实际上你需要 (",") 来避免太多空格 - jsfiddle.net/mplungjan/M42Qx 奇怪的是我们不能使用 \s

我想我现在已经把它整理好了。

【参考方案2】：

您可以使用map()，但我怀疑这会更快，因为您必须从 jQuery 对象转换为数组并返回到 jQuery 对象：

var results = $("b").get()
                    .map(function(e)  return $(e).text();)
                    .join(",");
alert(results);

jsFiddle link

【讨论】：

我喜欢 - 我想知道哪个更好，你的还是我在错误报告中找到的那个

【参考方案3】：

有一个 bug report 关于将此功能添加到 text() 方法，在提供了几种方法后，该方法以 worksforme 分辨率关闭。

【参考方案4】：

我想到的唯一选择是使用filter()：

var values = [];
$('b').filter(
    function()
        return values.push($(this).text());
    );
alert(values);

JS Fiddle demo.

这与使用each() 的解决方案并没有太大区别，因为它或多或少做同样的事情。