微信公众号 讲师中心
首页
文章
后端开发 web前端 数据库 开发工具 php框架 常见问题 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 自媒体 新闻
专题
后端开发 web前端 数据库 开发工具 php框架 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 新闻
AI工具
AI 聊天问答 Agent智能体 AI 文本写作 AI 绘画作图 AI 设计工具 AI 视频创作 AI 音频制作 AI 办公学习 AI 编程开发 Prompt指令
学习
大前端 后端开发 数据库 移动端 运维开发 计算机基础
编程手册
大前端 后端开发 数据库 移动端 运维开发 计算机基础
下载
js特效 网站源码 工具下载 类库下载 网站素材 学习资源 插件扩展 手机/移动开发 手机游戏
最近更新
搜索
后端开发 web前端 数据库 开发工具 php框架 常见问题 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程
自媒体 新闻
首页 > web前端 > js教程 > 正文

juqery 学习之三 选择器 可见性 元素属性_jquery

php中文网
发布： 2016-05-16 18:15:24
原创
1205人浏览过

:hidden

匹配所有的不可见元素，input 元素的 type 属性为 "hidden" 的话也会被匹配到

返回值

Array

示例

查找所有不可见的 tr 元素

HTML 代码:


 
 
Value 1
Value 2

jQuery 代码:

$("tr:hidden")

结果:

[ Value 1 ]

---------------------------------------------------------------------------------------

Flawless AI
Flawless AI

好莱坞2.0，电影制作领域的生成式AI工具

Flawless AI 32
查看详情 Flawless AI

:visible

匹配所有的可见元素

返回值

Array

示例

查找所有可见的 tr 元素

HTML 代码:


 
 
Value 1
Value 2

jQuery 代码:

$("tr:visible")

结果:

[ Value 2 ]

---------------------------------------------------------------------------------------

[attribute]

匹配包含给定属性的元素

返回值

Array

参数

attribute (String) : 属性名

示例

查找所有含有 id 属性的 div 元素

HTML 代码:


 

hello!



jQuery 代码:

$("div[id]")

结果:

[
]

---------------------------------------------------------------------------------------

[attribute=value]

匹配给定的属性是某个特定值的元素

返回值

Array

参数

attribute (String) : 属性名

value (String) : 属性值。引号在大多数情况下是可选的。但在遇到诸如属性值包含"]"时，用以避免冲突。

示例

查找所有 name 属性是 newsletter 的 input 元素

HTML 代码:

'

jQuery 代码:

$("input[name='newsletter']").attr("checked", true);

结果:

[ , ]

---------------------------------------------------------------------------------------

[attribute!=value]

匹配给定的属性是不包含某个特定值的元素

返回值

Array

参数

attribute (String) : 属性名

value (String) : 属性值。引号在大多数情况下是可选的。但在遇到诸如属性值包含"]"时，用以避免冲突。

示例

查找所有 name 属性不是 newsletter 的 input 元素

HTML 代码:

'

jQuery 代码:

$("input[name!='newsletter']").attr("checked", true);

结果:

[ ]

---------------------------------------------------------------------------------------

[attribute^=value]

匹配给定的属性是以某些值开始的元素

返回值

Array

参数

attribute (String) : 属性名

value ( String) : 属性值。引号在大多数情况下是可选的。但在遇到诸如属性值包含"]"时，用以避免冲突。

示例

查找所有 name 以 'news' 开始的 input 元素

HTML 代码:



jQuery 代码:

$("input[name^='news']")

结果:

[ , ]

---------------------------------------------------------------------------------------

[attribute$=value]

匹配给定的属性是以某些值结尾的元素

返回值

Array

参数

attribute (String) : 属性名

value (String) : 属性值。引号在大多数情况下是可选的。但在遇到诸如属性值包含"]"时，用以避免冲突。

示例

查找所有 name 以 'letter' 结尾的 input 元素

HTML 代码:



jQuery 代码:

$("input[name$='letter']")

结果:

[ , ]

---------------------------------------------------------------------------------------

[attribute*=value]

匹配给定的属性是以包含某些值的元素

返回值

Array

参数

attribute (String) : 属性名

value (String) : 属性值。引号在大多数情况下是可选的。但在遇到诸如属性值包含"]"时，用以避免冲突。

示例

查找所有 name 包含 'man' 的 input 元素

HTML 代码:




jQuery 代码:

$("input[name*='man']")

结果:

[ , , ]

---------------------------------------------------------------------------------------

[selector1][selector2][selectorN]

复合属性选择器，需要同时满足多个条件时使用。

返回值

Array

参数

selector1 (Selector) : 属性选择器

selector2 (Selector) : 另一个属性选择器，用以进一步缩小范围

selectorN (Selector) : 任意多个属性选择器

示例

找到所有含有 id 属性，并且它的 name 属性是以 man 结尾的

HTML 代码:




jQuery 代码:

$("input[id][name$='man']")

结果:

[ ]

大家都在看：

最佳 Windows 性能的顶级免费优化软件
最佳 Windows 性能的顶级免费优化软件

每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。

下载
来源：php中文网
收藏 点赞
上一篇：汉化英文版的Dreamweaver CS5并自动提示jquery_jquery 下一篇：js删除所有的cookie的代码_javascript技巧
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
最新问题
React Router v6 中组件传参的完整指南 本文旨在详细阐述ReactRouterv6中如何正确传递参数。我们将深入探讨Route组件的element属性的正确用法，以及如何利用ReactRouterv6提供的各种Hooks来替代v5版本中的路由特定props（如history、location和match），从而实现灵活且高效的组件间数据传递。
2025-11-22 12:34:38
305
JavaScript教程：如何将逗号分隔的数字字符串相乘并聚合 本教程详细介绍了如何使用JavaScript处理逗号分隔的数字字符串或数字数组，并将其中的所有数字相乘得到一个总结果。文章重点讲解了split()方法将字符串转换为数组，以及reduce()方法对数组元素进行累积乘法运算的实现细节和最佳实践，旨在提供清晰、专业的解决方案。
2025-11-22 12:32:51
573
JavaScript压缩技术_代码压缩与混淆 JavaScript压缩通过去除冗余字符、简化表达式和缩短变量名减小文件体积，提升加载速度；混淆则进一步重命名变量函数、扁平化控制流、加密字符串并插入无效代码，增强代码安全性。常用工具包括Terser、JavaScriptObfuscator等，建议开发保留源码，部署时压缩混淆，并避免上传sourcemap。
2025-11-22 12:22:02
632
Angular组件CSS样式隔离：理解与应用ViewEncapsulation 在Angular开发中，为确保组件样式仅作用于当前组件而不影响全局，关键在于正确配置视图封装模式。本文将深入探讨Angular的ViewEncapsulation机制，特别是默认的Emulated模式，解释其如何通过模拟ShadowDOM实现样式隔离，并指导开发者避免使用ViewEncapsulation.None和不必要的!important，从而维护组件样式的独立性与可维护性。
2025-11-22 12:21:03
938
解决React中“同一key的两个子元素”警告：深入理解与实践 在React开发中，当渲染列表时，遇到“Encounteredtwochildrenwiththesamekey”警告是一个常见问题。本文将深入探讨Reactkey属性的作用、为何会出现重复key的警告，以及如何通过正确使用唯一且稳定的标识符来解决这一问题。我们将重点分析即使使用数据ID作为key仍出现问题的原因，并提供诊断与优化建议，确保组件在更新时的正确性和性能。
2025-11-22 12:09:12
276
解决CSS display: none与transform动画冲突的策略 当尝试对使用display:none隐藏的元素应用CSStransform动画时，动画通常无法正常工作，因为浏览器在应用display:block后会一次性渲染所有样式。要解决此问题，需要在设置display:block后，使用setTimeout引入短暂延迟，让浏览器有机会渲染元素，然后再应用transform样式，从而确保动画平滑执行。对于隐藏元素，则应在transform动画完成后再设置display:none。
2025-11-22 12:02:02
140
Vue 3 v-model 高级实践：掌握父子组件数据同步与响应式重置的技巧 本文深入探讨Vue3中v-model在父子组件间数据同步与重置时的常见问题及最佳实践。重点解析了父组件响应式数据重置的正确姿势、子组件v-model属性的响应式维护方法，以及类型安全和输入处理的优化策略，旨在帮助开发者构建更健壮、高效的Vue应用。
2025-11-22 11:55:19
185
JavaScript浏览器API_DOM操作性能最佳实践 减少重排与重绘，避免循环中读写样式属性，通过切换CSS类批量修改样式，并将元素脱离文档流操作；2.使用DocumentFragment批量插入节点，仅触发一次渲染；3.利用事件委托在父级处理子元素事件，降低内存消耗；4.缓存DOM查询结果，避免重复查找，防止内存泄漏；合理组织DOM操作可显著提升页面性能。
2025-11-22 11:53:30
616
JavaScript图形绘制_Canvas高级动画技术 Canvas通过2D上下文实现高效绘图，利用requestAnimationFrame构建流畅动画循环，结合坐标变换与粒子系统可实现复杂动态效果。
2025-11-22 11:47:02
495
使用 jQuery 实现多文件（图片与PDF）上传预览及删除功能 本教程详细介绍了如何利用jQuery在前端实现一个功能完善的多文件上传组件。该组件支持同时上传图片和PDF文件，并提供即时预览功能及便捷的删除操作。我们将从HTML结构、CSS样式到核心JavaScript逻辑进行全面讲解，旨在帮助开发者构建用户友好的文件上传界面。
2025-11-22 11:42:16
125
相关专题
更多>
热门推荐
开源免费商场系统广告
热门教程
更多>
相关推荐
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网：公益在线php培训，帮助PHP学习者快速成长！
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • PHP学习

  • 技术支持

  • 返回顶部