Question

这里有一个类似的答案，但它有点不同，不适合我的情况，我不能只做一个join()： an array of strings as a jQuery selector?

我有一个看起来像这样的动态数组，

['abc', 'def', 'ghi']

我需要按如下方式执行选择器字符串，包括所有这些值作为data-event属性，如下所示：

$('li.event[data-event="' + /*every element from the array*/ + '"]');

有没有办法避免循环？

Answer 1

数组data-event的每个元素都需要包含在显示的Selector字符串中。那是我的选择器。例如：.event[data-event="abc"], .event[data-event="def"], .event[data-event="ghi"]。

在这种情况下，您需要为每个元素构建一个单独的选择器，并将它们join()组合在一起。您可以使用map()：

实现这一目标

var arr = ['abc', 'def', 'ghi'];
var selector = arr.map(function(el) {
  return `.event[data-event="${el}"]`;
}).join(',');

$(selector).addClass('foo');

.foo { color: #C00; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="event" data-event="abc">ABC</div>
<div class="event" data-event="def">DEF</div>
<div class="event" data-event="ghi">GHI</div>
<div class="event" data-event="xyz">XYZ</div>

Answer 2

目标是获得一个看起来像的选择器：

.event[data-event="abc"],.event[data-event="def"],.event[data-event="ghi"]

可以以join的方式执行此操作：

var arr = ['abc', 'def', 'ghi'];

var part1 = '.event[data-event="';
var part2 = '"]';

var sel = part1 + arr.join(part2 + "," + part1) + part2;

console.log(sel);

String Array中的jQuery Selector

2 个答案: