jQuery学习2 选择器的使用说明


Posted in Javascript onFebruary 07, 2010

1.利用CSS的基本选择器:
a:匹配所有链接<a>元素。
#*:匹配id为*的元素
.*:匹配CSS类为*的元素
a#*id.*class:匹配id为*id,并拥有CSS类为*class的链接元素。
以上是CSS中的写法,在jQuery中用$("")包起来,如:jQuery("p a.Class")

利用子选择器、容器选择器和特性选择器,以下面的为例:

<ul class="myList"> 
<li><a href=http://jquery.com>jQuery supports</a> 
<ul> 
<li><a href="css1">CSS1</a></li> 

<li><a href="css2">CSS2</a></li> 

<li><a href="css3">CSS3</a></li> 

<li>Basic XPath</li> 
</ul> 
</li> 
<li> 
<ul> 
<li>Custom selectors</li> 
<li>Form selectors</li> 
</ul> 
</li> 
</ul>

如果要选择第一个列表<li>中的所有链接做操作就应利用子选择器:ul.myList > li >a 而不能像这样ul.myList li a 因为所有这些链接<a>都是列表<li>元素的后代节点.
子选择器:父节点与直接子节点以右尖括号(>)隔开。
特性选择器:将符合特定内容的元素包起来。比如选择包含以http://开头的href值的链接:a[href^=http://]
input[type=text]:匹配type特性为text的所有<input>元素
div[title=^my]:匹配title特性值以my开头的所有<div>元素。
通过位置选择
a:first:选择器匹配页面上的第一个<a>元素
p:odd,p:even 分别匹配奇数和偶数元素
其他就不一一举例了,如有需要可到相关网站查找。
Javascript 相关文章推荐
JavaScript文档碎片操作实例分析
Dec 12 Javascript
基于jQuery实现左右图片轮播(原理通用)
Dec 24 Javascript
Bootstrap开发实战之第一次接触Bootstrap
Jun 02 Javascript
Node.js中常规的文件操作总结
Oct 13 Javascript
JS+CSS3制作炫酷的弹窗效果
Nov 08 Javascript
JavaScript获取短信验证码(周期性)
Dec 29 Javascript
jQuery源码分析之init的详细介绍
Feb 13 Javascript
jQuery EasyUI 选项卡面板tabs的使用实例讲解
Dec 25 jQuery
jQuery实现导航样式布局操作示例【可自定义样式布局】
Jul 24 jQuery
vue实现分页组件
Jun 16 Javascript
Vue路由对象属性 .meta $route.matched详解
Nov 04 Javascript
详细谈谈JavaScript中循环之间的差异
Aug 23 Javascript
jQuery ctrl+Enter shift+Enter实现代码
Feb 07 #Javascript
JQuery 获取和设置Select选项的代码
Feb 07 #Javascript
经典海量jQuery插件 大家可以收藏一下
Feb 07 #Javascript
jQuery AnythingSlider滑动效果插件
Feb 07 #Javascript
javascript 函数速查表
Feb 07 #Javascript
js 键盘记录实现(兼容FireFox和IE)
Feb 07 #Javascript
javascript 同时在IE和FireFox获取KeyCode的代码
Feb 07 #Javascript
You might like
php操作sqlserver关于时间日期读取的小小见解
2009/11/29 PHP
PHP获取音频文件的相关信息
2015/06/22 PHP
PHP计算日期相差天数实例分析
2016/02/23 PHP
Laravel搭建后台登录系统步骤详解
2016/07/26 PHP
基于PHP的微信公众号的开发流程详解
2020/08/07 PHP
JS中剪贴板兼容性、判断复制成功或失败
2021/03/09 Javascript
10个新的最有前途的JavaScript框架
2009/03/12 Javascript
表单提交前触发函数返回true表单才会提交
2014/03/11 Javascript
JS生成不重复随机数组的函数代码
2014/06/10 Javascript
JS实现队列与堆栈的方法
2016/04/21 Javascript
jQuery实现页面评论栏中访客信息自动填写功能的方法
2016/05/23 Javascript
Vue表单验证插件的制作过程
2017/04/01 Javascript
简单实现js放大镜效果
2017/07/24 Javascript
vue项目中axios请求网络接口封装的示例代码
2018/12/18 Javascript
详解vue中router-link标签所必备了解的属性
2019/04/15 Javascript
nuxt配置通过指定IP和端口访问的实现
2020/01/08 Javascript
详解如何使用React Hooks请求数据并渲染
2020/10/18 Javascript
Python3中的真除和Floor除法用法分析
2016/03/16 Python
Python数据分析之双色球基于线性回归算法预测下期中奖结果示例
2018/02/08 Python
python八皇后问题的解决方法
2018/09/27 Python
Python3 单行多行万能正则匹配方法
2019/01/07 Python
利用python实现在微信群刷屏的方法
2019/02/21 Python
实例详解python函数的对象、函数嵌套、名称空间和作用域
2019/05/31 Python
Django Xadmin多对多字段过滤实例
2020/04/07 Python
利用python下载scihub成文献为PDF操作
2020/07/09 Python
Python使用xpath实现图片爬取
2020/09/16 Python
CSS3 实现弹跳的小球动画
2020/10/26 HTML / CSS
HTML5 DeviceOrientation实现手机网站摇一摇功能代码实例
2015/04/24 HTML / CSS
波兰快递服务:Globkurier.pl
2019/11/08 全球购物
static全局变量与普通的全局变量有什么区别?static局部变量和普通局部变量有什么区别?static函数与普通函数有什么区别?
2015/02/22 面试题
大学生求职简历的自我评价
2013/10/21 职场文书
经贸日语专业自荐信
2014/09/02 职场文书
暂住证证明
2015/06/19 职场文书
2016年秋季运动会通讯稿
2015/11/25 职场文书
使用redis实现延迟通知功能(Redis过期键通知)
2021/09/04 Redis
Android使用EventBus发送消息,Fragment中接收消息的方法会执行多次
2022/04/24 Java/Android