如何在jQuery属性选择器中组合逻辑OR和逻辑AND?

时间:2010-12-10 01:57:08

标签: javascript jquery attributes jquery-selectors

给出以下XML:

<users>
    <user state="CA" sex="m">Max</user>
    <user state="AZ" sex="f">Jen</user>
    <user state="OR" sex="f">Kim</user>
    <user state="NV" sex="m">Bob</user>
    <user state="CA" sex="m">Jon</user>
    <user state="AZ" sex="m">Jim</user>
    <user state="OR" sex="f">Joy</user>
    <user state="NV" sex="f">Amy</user>
</users>

使用jQuery,有没有办法选择男性用户,来自CA或NV,但没有使用过滤功能?要清楚,我知道

$(xml).find("user[sex='m']")

仅选择男性用户,而

$(xml).find("user[state='CA'],[state='NV']")

从CA或NV中选择所有用户。但是我无法将它们与单个选择器中的逻辑AND组合在一起。

然而,使用过滤器功能可以起到以下作用:

$(xml).find("user").filter(function() {
    return $(this).attr('sex') == 'm' && ($(this).attr('state') == 'CA' || $(this).attr('state') == 'NV')
}).each(function() {
    alert($(this).text());
});

谢谢!

2 个答案:

答案 0 :(得分:20)

试试这个:

$(xml).find("user[sex='m'][state='CA'], user[sex='m'][state='NV']")

基本上,您将sexstate属性链接在一个简单的选择器中(这将是您的逻辑AND),并且每个状态重复一次(这将是您的逻辑OR)。

测试:

$(xml).find("user[sex='m'][state='CA'], user[sex='m'][state='NV']")
      .each(function() {
          alert($(this).text() + " - " + $(this).attr('state'));
      });

输出:

Max - CA
Bob - NV
Jon - CA

答案 1 :(得分:1)

您可以组合多个选择器,但语法不完全正确:

$(xml).find("user[state='CA'],[state='NV']")

这会找到所有&lt; user&gt;具有状态“CA”的元素和具有状态“NV”的任何其他节点(不一定是&lt; user&gt;)。你想要的是:

$(xml).find("user[state=CA][sex=m],user[state=NV][sex=m]")

如果您不想重复自己:

$(xml).find("user").filter("[state='CA'],[state='NV']").filter("[sex='m']");