Question

我想合并由另一个选择器分割的选择器我的实际选择器看起来像$('.JS_toggle-submenu')

<li class="JS_toggle-submenu" data-submenu="#submenu-l2-foo">…</li>
<h2 class="JS_toggle-submenu" data-submenu="#submenu-l2-foo">…</h2>
<p class="JS_toggle-submenu" data-submenu="#submenu-l3-bar">…</p>
<h3 class="JS_toggle-submenu" data-submenu="#submenu-l3-bar">…</h3>

并希望将其过滤到每个数据子菜单的第一个，如
$('.JS_toggle-submenu').filter('[data=GROUPING]:first')

<li class="JS_toggle-submenu" data-submenu="#submenu-l2-foo">…</li>
<p class="JS_toggle-submenu" data-submenu="#submenu-l3-bar">…</p>

当然，我不是在寻找静态解决方案我没有看到有效的方法来做到这一点，似乎我需要再次循环，但我宁愿避免，但也许有人在这里有一个神奇的解决方案？

//编辑：
我需要兼容IE7 / 8，这就是为什么我没有选择indexOf解决方案，但我在原来的问题中省略了解释。
我在这里比较了两个结果http://jsperf.com/filter-loop-or-regex相同 Ops / sec 。

Answer 1

您可以根据之前找到的对象数组过滤掉ID。类似的东西：

// Array of IDs already found
var existing = [];
// Regex to pull the level number from the data attribute
var regexp = new RegExp("#submenu-l([0-9]+)-(.*?)", "i");
console.log($(".JS_toggle-submenu[data-submenu^='#submenu-l']").filter(function() {
    // Get the ID
    var id = regexp.exec($(this).data("submenu"))[1];
    // If we have already found a DOM element for this level, continue
    if(existing[id]) return false;
    // Otherwise add it to the existing found elements...
    existing[id] = true;
    // Allow it to pass through the filter
    return true;
}).get());

Working Example

Answer 2

这里使用jquery每个循环：http://jsfiddle.net/3y69usxv/

var submenus = [];
var firstMenus = [];

$('.JS_toggle-submenu').each(function(){
    var $this = $(this);

    if (submenus.indexOf($this.data('submenu')) < 0) {
        submenus.push($this.data('submenu'));
        firstMenus.push($this);
    }
});

console.log(firstMenus);

jQuery合并/过滤器选择器

2 个答案: