0

0

jQuery中选择器的归纳总结

yulia

yulia

发布时间:2018-09-26 15:13:29

|

2365人浏览过

|

来源于php中文网

原创

jquery中的选择器有很多,比如基本选择器,表单选择器,过滤选择器等等,有些不经常使用,就容易忘记,最近对jquery中的选择器做了一个总结,方便自己可以查看,同时分享给大家,希望可以帮助到你。

基本选择器

//ID选择器  $("#id") 

//元素选择器     $("div")    

//类选择器        $(".classname")  

//组合选择器    $(".classname,.classname1,#id1") 

层次选择器

//子元素选择器     $("#id>.classname") 

//后代元素选择器   $("#id .classname")  

//紧邻下一个元素选择器   $("#id + .classname")

//兄弟元素选择器    $("#id ~ .classname")   

过滤选择器

//第一个li   $("li:first")

//最后一个li    $("li:last")  

//挑选下标为偶数的li   $("li:even") 

//挑选下标为奇数的li    $("li:odd")

//下标等于4的li     $("li:eq(4)")

//下标大于2的li   $("li:gt(2)") 

//下标小于2的li   $("li:lt(2)")    

//挑选除 id="runoob" 以外的所有li  $("li:not(#runoob)")

内容过滤选择器

// 包含 Runob文本的元素   $("div:contains('Runob')") 

//不包含子元素或者文本的空元素   $("td:empty")         

//含有选择器所匹配的元素      $("div:has(selector)") 

//含有子元素或者文本的元素      $("td:parent") 

可见性过滤选择器

//匹配所有不可见元素,或type为hidden的元素  $("li:hidden") 

Groq
Groq

GroqChat是一个全新的AI聊天机器人平台,支持多种大模型语言,可以免费在线使用。

下载

//匹配所有可见元素     $("li:visible")

属性过滤选择器

//所有含有 id 属性的 div元素   $("div[id]")     

// id属性值为123的div元素   $("div[id='123']")  

// id属性值不等于123的div元素      $("div[id!='123']") 

// id属性值以qq开头的div元素       $("div[id^='qq']")

// id属性值以zz结尾的div元素        $("div[id$='zz']")  

// id属性值包含bb的div元素      $("div[id*='bb']") 

//多属性选过滤,同时满足两个属性的条件的元素       $("input[id][name$='man']")

状态过滤选择器

// 匹配可用的 input  $("input:enabled")   

// 匹配不可用的 input   $("input:disabled") 

// 匹配选中的 input  $("input:checked")   

// 匹配选中的 option  $("option:selected")

表单选择器

//匹配所有 input, textarea, select 和 button 元素   $(":input") 

//所有的单行文本框,$(":text") 等价于$("[type=text]"),推荐使用$("input:text")效率更高,下同    $(":text") 

//所有密码框      $(":password") 

//所有单选按钮  $(":radio")    

//所有复选框   $(":checkbox")

//所有提交按钮   $(":submit") 

//所有重置按钮    $(":reset")  

//所有button按钮    $(":button") 

//所有文件域    $(":file")

相关专题

更多
php源码安装教程大全
php源码安装教程大全

本专题整合了php源码安装教程,阅读专题下面的文章了解更多详细内容。

65

2025.12.31

php网站源码教程大全
php网站源码教程大全

本专题整合了php网站源码相关教程,阅读专题下面的文章了解更多详细内容。

43

2025.12.31

视频文件格式
视频文件格式

本专题整合了视频文件格式相关内容,阅读专题下面的文章了解更多详细内容。

35

2025.12.31

不受国内限制的浏览器大全
不受国内限制的浏览器大全

想找真正自由、无限制的上网体验?本合集精选2025年最开放、隐私强、访问无阻的浏览器App,涵盖Tor、Brave、Via、X浏览器、Mullvad等高自由度工具。支持自定义搜索引擎、广告拦截、隐身模式及全球网站无障碍访问,部分更具备防追踪、去谷歌化、双内核切换等高级功能。无论日常浏览、隐私保护还是突破地域限制,总有一款适合你!

41

2025.12.31

出现404解决方法大全
出现404解决方法大全

本专题整合了404错误解决方法大全,阅读专题下面的文章了解更多详细内容。

204

2025.12.31

html5怎么播放视频
html5怎么播放视频

想让网页流畅播放视频?本合集详解HTML5视频播放核心方法!涵盖<video>标签基础用法、多格式兼容(MP4/WebM/OGV)、自定义播放控件、响应式适配及常见浏览器兼容问题解决方案。无需插件,纯前端实现高清视频嵌入,助你快速打造现代化网页视频体验。

9

2025.12.31

关闭win10系统自动更新教程大全
关闭win10系统自动更新教程大全

本专题整合了关闭win10系统自动更新教程大全,阅读专题下面的文章了解更多详细内容。

8

2025.12.31

阻止电脑自动安装软件教程
阻止电脑自动安装软件教程

本专题整合了阻止电脑自动安装软件教程,阅读专题下面的文章了解更多详细教程。

3

2025.12.31

html5怎么使用
html5怎么使用

想快速上手HTML5开发?本合集为你整理最实用的HTML5使用指南!涵盖HTML5基础语法、主流框架(如Bootstrap、Vue、React)集成方法,以及无需安装、直接在线编辑运行的平台推荐(如CodePen、JSFiddle)。无论你是新手还是进阶开发者,都能轻松掌握HTML5网页制作、响应式布局与交互功能开发,零配置开启高效前端编程之旅!

2

2025.12.31

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
jQuery 教程
jQuery 教程

共42课时 | 3.6万人学习

HTML+CSS基础与实战
HTML+CSS基础与实战

共132课时 | 9.3万人学习

tp6+adminlte搭建通用后台
tp6+adminlte搭建通用后台

共39课时 | 5.7万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

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