jQuery学习笔记之jQuery选择器的使用


Posted in Javascript onDecember 22, 2010

一.基本选择器:

  • #id   :选择给定ID名的元素 如:$("#id1")为选择id为id1的元素
  • .class   :选择给定类名的元素
  • element   :选择给定元素名的所有原色
  • *  :匹配所有元素
  • selector1,selector2,......   :选择这些名称的元素,以逗号隔开,可以是类或id名

二.层次选择器:

  • $("ancestor  descendant") :选择ancestor元素下的所有descendant(后代)元素
  • $("parent>child") :选择parent下的所有child(子)元素
  • $('prev+next') :选择紧跟prev后面的第一个next元素
  • $('prev~siblings') :选择prev后面的所有siblings元素

      $('prev+next') 和$(.prev).next("next")作用一样

      $('prev~siblings')和$(.prev).nextAll("siblings")作用一样

 

三.过滤选择:

  • :first    选择第一个元素  如:$("div:first")为选择第一个div元素
  • :last   选择最后一个元素
  • :not(selector)  选择不是selector的元素
  • :even  选择偶数索引的元素
  • :odd  选择所有奇数索引的元素
  • :eq(index)  选择索引等于index的元素
  • :gt(index)  选择索引大于index的元素
  • :lt(index)  选择索引小于index的元素
  • :header  选择所有<H>元素
  • :animanted  选择所有动画元素

四。内容过滤:

  • :contains(text)  选择含有text文本的元素 如:$("div:contains('hello')")为选择含有hello字符的div元素
  • :empty 选择所有不含字符的元素
  • :has(selector)  选择含有selector元素的元素
  • :parent 选择含有子元素的元素

五。可见性过滤:

  • :hidden 选择所有可见元素
  • :visible 选择所有不可见元素

六。属性过滤:

  • [attribute]  选择拥有此属性的元素 如$("div[id]")选择包含id属性的div元素
  •  [attribute=value] 选择attribute属性等于value值的元素
  •  [attribute!=value]  选择attribute属性不等于value值的元素
  •  [attribute^=value]   选择attribute属性等于value值的元素
  •  [attribute$=value]  选择attribute属性值以value值开始的元素
  •  [attribute*=value]  选择attribute属性值含有value值的元素
  • [selector1][selector2]....满足这些条件的元素(组合)

七。子元素过滤选择器

  • :nth-child(index/even/odd/eqation)选择父元素下的[索引/偶/奇]的子元素
  • :first-child 选择父元素的第一个子元素
  • :last-child选择父元素的最后一个子元素
  • :only-child 选择父元素下是唯一的子元素

八。表单属性过滤

  • :enabled 选择所有可见元素 如:$("#form1:enabled")是选择表单id为form1的所有可以用元素
  • :disable 选择所有不可见元素
  • :checked 选择所有被选择的元素
  • :selected 选择所有被选中的选项元素

九.表单对象过滤

  • :input  选择所有<input><textarea><select><button>元素
  • :text 选择所有单行文本款,下面的都是这个格式
  • :password
  • :radio
  • :checkbox
  • :submit
  • :image
  • :reset
  • :button
  • :file
  • :hidden
     
Javascript 相关文章推荐
jQuery EasyUI API 中文文档 - Menu菜单
Oct 03 Javascript
可兼容IE的获取及设置cookie的jquery.cookie函数方法
Sep 02 Javascript
jquery $.fn $.fx是什么意思有什么用
Nov 04 Javascript
JS和Jquery获取和修改label的值的示例代码
Jan 15 Javascript
多个$(document).ready()的执行顺序实例分析
Jul 26 Javascript
jQuery 判断图片是否加载完成方法汇总
Aug 10 Javascript
Javascript在IE和Firefox浏览器常见兼容性问题总结
Aug 03 Javascript
jQuery实现弹窗居中效果类似alert()
Feb 27 Javascript
详解自定义ajax支持跨域组件封装
Feb 08 Javascript
vue2.0.js的多级联动选择器实现方法
Feb 09 Javascript
解决vue-router在同一个路由下切换,取不到变化的路由参数问题
Sep 01 Javascript
vue 图片裁剪上传组件的实现
Nov 12 Javascript
jQuery学习笔记之DOM对象和jQuery对象
Dec 22 #Javascript
jQuery学习笔记之Helloworld
Dec 22 #Javascript
用Jquery实现多级下拉框无刷新的联动
Dec 22 #Javascript
一个轻量级的javascript库 pj介绍
Dec 19 #Javascript
JavaScript Date对象 日期获取函数
Dec 19 #Javascript
jQuery UI Datepicker length为空或不是对象错误的解决方法
Dec 19 #Javascript
jQuery UI Dialog控件中的表单无法正常提交的解决方法
Dec 19 #Javascript
You might like
用libtemplate实现静态网页生成
2006/10/09 PHP
解析strtr函数的效率问题
2013/06/26 PHP
浅析memcache启动以及telnet命令详解
2013/06/28 PHP
php后门URL的防范
2013/11/12 PHP
php获取目标函数执行时间示例
2014/03/04 PHP
10款实用的PHP开源工具
2015/10/23 PHP
php-msf源码详解
2017/12/25 PHP
Thinkphp5.0 框架实现控制器向视图view赋值及视图view取值操作示例
2019/10/12 PHP
MooTools 页面滚动浮动层智能定位实现代码
2011/08/23 Javascript
全面解析Bootstrap中form、navbar的使用方法
2016/05/30 Javascript
JS组件系列之使用HTML标签的data属性初始化JS组件
2016/09/14 Javascript
JS中Array数组学习总结
2017/01/18 Javascript
jquery replace方法去空格
2017/05/08 jQuery
一篇文章让你彻底弄懂JS的事件冒泡和事件捕获
2017/08/14 Javascript
Angular中使用MathJax遇到的一些问题
2017/12/15 Javascript
jQuery实现仿京东防抖动菜单效果示例
2018/07/06 jQuery
react中实现搜索结果中关键词高亮显示
2018/07/31 Javascript
详解Vue之父子组件传值
2019/04/01 Javascript
JavaScript实现轮播图特效
2020/04/10 Javascript
[01:28:43]2014 DOTA2华西杯精英邀请赛5 24 DK VS CIS
2014/05/25 DOTA
pycharm 使用心得(七)一些实用功能介绍
2014/06/06 Python
使用Python装饰器在Django框架下去除冗余代码的教程
2015/04/16 Python
python 处理dataframe中的时间字段方法
2018/04/10 Python
Python(Django)项目与Apache的管理交互的方法
2018/05/16 Python
用Python实现BP神经网络(附代码)
2019/07/10 Python
python实现梯度下降法
2020/03/24 Python
Python 实现简单的客户端认证
2020/07/29 Python
HTML5标签大全
2016/11/23 HTML / CSS
PHP高级工程师面试问题推荐
2013/01/18 面试题
中文专业毕业生自荐书范文
2014/01/04 职场文书
俄罗斯商务邀请函
2014/01/26 职场文书
关于读书的演讲稿
2014/05/07 职场文书
2014法制宣传日活动总结范文
2014/11/01 职场文书
大学生见习报告总结
2014/11/04 职场文书
冰峪沟导游词
2015/02/09 职场文书
预备党员入党感言
2015/08/01 职场文书