如何在 jQuery 属性选择器中将逻辑 OR 与逻辑 AND 结合起来?

2023-03-16前端开发问题
1

本文介绍了如何在 jQuery 属性选择器中将逻辑 OR 与逻辑 AND 结合起来?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着跟版网的小编来一起学习吧!

问题描述

给定以下 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,但不使用过滤功能?说清楚,我知道

Using jQuery, is there a way to select users who are male and are either from CA or NV, but without using the filter function? To be clear, I know that

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

只选择男性用户,而

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

从 CA 或 NV 中选择所有用户.但我无法在单个选择器中将它们与逻辑 AND 结合起来.

selects all users from either CA or NV. But I am not able to combine both of them with a logical AND within a single selector.

但是,使用过滤器功能,以下工作:

Using the filter function, however, the following works:

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

谢谢!

推荐答案

试试这个:

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

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

Basically you chain the sex and state attributes together in a single simple selector (this would be your logical AND), and repeat them once per state (and this would be your logical 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

这篇关于如何在 jQuery 属性选择器中将逻辑 OR 与逻辑 AND 结合起来?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持跟版网!

The End

相关推荐

如何使用百度地图API获取地理位置信息
首先,我们需要在百度地图开放平台上申请一个开发者账号,并创建一个应用。在创建应用的过程中,我们会得到一个密钥(ak),这是调用API的凭证。 接下来,我们需要准备一个PHP文件,以便可以在网页中调用。首先,我们需要引入百度地图API的JS文件,代码如下...
2024-11-22 前端开发问题
244

ajax请求获取json数据并处理的实例代码
ajax请求获取json数据并处理的实例代码 $.ajax({ type: 'GET', url: 'https://localhost:44369/UserInfo/EditUserJson',//请求数据 data: json,//传递数据 //dataType:'json/text',//预计服务器返回的类型 timeout: 3000,//请求超时的时间 //回调函数传参 suc...
2024-11-22 前端开发问题
215

js删除数组中指定元素的5种方法
在JavaScript中,我们有多种方法可以删除数组中的指定元素。以下给出了5种常见的方法并提供了相应的代码示例: 1.使用splice()方法: let array = [0, 1, 2, 3, 4, 5];let index = array.indexOf(2);if (index -1) { array.splice(index, 1);}// array = [0,...
2024-11-22 前端开发问题
182

layui 单选框、复选框、下拉菜单不显示问题如何解决?
1. 如果是ajax嵌套了 页面, 请确保 只有最外层的页面引入了layui.css 和 layui.js ,内层页面 切记不要再次引入 2. 具体代码如下 layui.use(['form', 'upload'], function(){ var form = layui.form; form.render(); // 加入这一句});...
2024-11-09 前端开发问题
313

layui树状组件tree怎么默认勾选?
在layui树状组件tree中,勾选问题可以通过以下方法解决: 通过tree的oncheck事件来监听勾选操作,然后根据勾选状态进行相应的处理。例如: tree.on('check', function(obj) { // 获取勾选状态 var isChecked = obj.checked; // 获取当前节点数据 var data =...
2024-11-09 前端开发问题
372

layui tree树组件怎么自定义添加图标
经常用到layui的朋友都知道,layui tree默认是不能自定义图标的,那么我们要自定义的话要怎么操作呢? 首先用编辑器软件(修改时候用编辑器记得编码),打开layui.js。搜索: i class="layui-icon layui-icon-file" 改为如下代码: i class="'+ (i.icon || "l...
2024-10-26 前端开发问题
493