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 相关文章推荐
JS类中定义原型方法的两种实现的区别
Mar 08 Javascript
JQuery+JS实现仿百度搜索结果中关键字变色效果
Aug 02 Javascript
使用UglifyJS合并/压缩JavaScript的方法
Mar 07 Javascript
js阻止冒泡及jquery阻止事件冒泡示例介绍
Nov 19 Javascript
全面解析Bootstrap中nav、collapse的使用方法
May 22 Javascript
jQuery EasyUI中的日期控件DateBox修改方法
Nov 09 Javascript
使用jQuery监听扫码枪输入并禁止手动输入的实现方法(推荐)
Mar 21 jQuery
原生js 封装get ,post, delete 请求的实例
Aug 11 Javascript
Vue调试神器vue-devtools安装方法
Dec 12 Javascript
vue 项目如何引入微信sdk接口的方法
Dec 18 Javascript
vue 实现左右拖拽元素并且不超过他的父元素的宽度
Nov 30 Javascript
Vue.js样式动态绑定实现小结
Jan 24 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学习笔记之 函数声明
2011/06/09 PHP
ThinkPHP基本的增删查改操作实例教程
2014/08/22 PHP
php微信分享到朋友圈、QQ、朋友、微博
2019/02/18 PHP
Laravel如何创建服务器提供者实例代码
2019/04/15 PHP
User Scripts: Video Download by User Scripts
2007/05/14 Javascript
js中的json对象详细介绍
2014/10/29 Javascript
js获取内联样式的方法
2015/01/27 Javascript
学习JavaScript设计模式之模板方法模式
2016/01/20 Javascript
基于Javascript实现返回顶部按钮
2016/02/29 Javascript
jQuery异步提交表单的两种方式
2016/09/13 Javascript
jquery 判断div show的状态实例
2016/12/03 Javascript
JavaScript实现简单的双色球(实例讲解)
2017/07/31 Javascript
Angular开发实践之服务端渲染
2018/03/29 Javascript
如何在vue 中使用柱状图 并自修改配置
2021/01/21 Vue.js
[38:54]完美世界DOTA2联赛PWL S2 Rebirth vs LBZS 第一场 11.28
2020/12/01 DOTA
跟老齐学Python之传说中的函数编写条规
2014/10/11 Python
用map函数来完成Python并行任务的简单示例
2015/04/02 Python
python的else子句使用指南
2016/02/27 Python
Django 使用logging打印日志的实例
2018/04/28 Python
Python实现操纵控制windows注册表的方法分析
2019/05/24 Python
Pycharm 解决自动格式化冲突的设置操作
2021/01/15 Python
利用CSS3的checked伪类实现OL的隐藏显示的方法
2010/12/18 HTML / CSS
解决HTML5手机端页面缩放的问题
2017/10/27 HTML / CSS
意大利灯具购物网站:Lampade.it
2018/10/18 全球购物
俄罗斯厨房产品购物网站:COOK HOUSE
2021/03/15 全球购物
机械化及自动化毕业生的自我评价分享
2013/11/06 职场文书
幼儿园教师培训方案
2014/02/04 职场文书
聚美优品励志广告词
2014/03/14 职场文书
企业法人代表证明书
2014/09/27 职场文书
个人年终总结结尾
2015/03/06 职场文书
2014年底个人工作总结
2015/03/10 职场文书
农村党支部承诺书
2015/04/30 职场文书
开会迟到检讨书范文
2015/05/06 职场文书
python如何获取网络数据
2021/04/11 Python
十大最强妖精系宝可梦,哲尔尼亚斯实力最强,第五被称为大力士
2022/03/18 日漫
python的netCDF4批量处理NC格式文件的操作方法
2022/03/21 Python