Javascript 替代正则表达式来隐藏匹配的id元素？

考虑以下HTML：

<div id=plan>
  <div id="plan-1" class='plan-hide'>One</div>
  <div id="plan-2" class='plan-hide'>Two</div>
  <div id="plan-3">Three</div>
  <div id="plan-4" class='plan-hide'>Four</div>
</div>

---

什么是替代方法？

您可以使用父id计划来缩短匹配元素的范围

$('#plan [id^=plan-]').addClass('plan-hide');

---

您可以使用父id计划来缩短匹配元素的范围

$('#plan [id^=plan-]').addClass('plan-hide');

---

如果试图将类添加到容器中的所有元素（与ui值+1匹配的元素除外），则将所有同级作为目标可能会更快：

    slide: function( event, ui ) {
        $("#plan-" + (ui.value+1)).removeClass('plan-hide')
                                  .siblings().addClass('plan-hide');
    },

甚至只是：

    slide: function( event, ui ) {
        $('#plan').children('div').addClass('plan-hide');
        $("#plan-" + (ui.value+1)).removeClass('plan-hide');
    },

而且可能是最快的：

var elems = document.getElementById('plan').getElementsByTagName('div'),    
    len = elems.length;

$("#slider").slider({
    range: "min",
    min: 0,
    max: 4
}, {
    slide: function( event, ui ) {
        for (var i=0; i<len; i++) {
            elems[i].className = elems[i].id.indexOf(ui.value+1) != -1 ? '' : 'plan-hide';
        }
    },
});
​

---

如果试图将类添加到容器中的所有元素（与ui值+1匹配的元素除外），则将所有同级作为目标可能会更快：

    slide: function( event, ui ) {
        $("#plan-" + (ui.value+1)).removeClass('plan-hide')
                                  .siblings().addClass('plan-hide');
    },

甚至只是：

    slide: function( event, ui ) {
        $('#plan').children('div').addClass('plan-hide');
        $("#plan-" + (ui.value+1)).removeClass('plan-hide');
    },

而且可能是最快的：

var elems = document.getElementById('plan').getElementsByTagName('div'),    
    len = elems.length;

$("#slider").slider({
    range: "min",
    min: 0,
    max: 4
}, {
    slide: function( event, ui ) {
        for (var i=0; i<len; i++) {
            elems[i].className = elems[i].id.indexOf(ui.value+1) != -1 ? '' : 'plan-hide';
        }
    },
});
​

---

它不是一个真正的正则表达式，它是一个以选择器开始的jQuery，但它可能是在幕后使用正则表达式，它可能比仅仅通过整个ID进行选择慢得多。在幻灯片回调中执行此操作将在滑块的每一个增量上触发类的添加/删除，这使得它更慢。它不是真正的正则表达式，它是一个以选择器开始的jQuery，但它可能是在幕后使用regex，并且可能比仅通过整个ID进行选择慢得多。在幻灯片回调中执行此操作将在滑块的每个增量上触发类的添加/删除，这使得它更慢。