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 到 JQuery (1)学习小结
Feb 12 Javascript
document.getElementById的简写方式(获取id对象的简略写法)
Sep 10 Javascript
简介AngularJS的视图功能应用
Jun 17 Javascript
javascript实现控制的多级下拉菜单
Jul 05 Javascript
javascript比较两个日期相差天数的方法
Jul 24 Javascript
原生javascript实现的ajax异步封装功能示例
Nov 03 Javascript
HTML5 js实现拖拉上传文件功能
Nov 20 Javascript
angular4实现tab栏切换的方法示例
Oct 21 Javascript
layui点击导航栏刷新tab页的示例代码
Aug 14 Javascript
vue动态改变背景图片demo分享
Sep 13 Javascript
简单分析js中的this的原理
Aug 31 Javascript
vue-resource:jsonp请求百度搜索的接口示例
Nov 09 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中配置IIS7实现基本身份验证的方法
2015/09/24 PHP
Laravel框架源码解析之入口文件原理分析
2020/05/14 PHP
jQuery 位置函数offset,innerWidth,innerHeight,outerWidth,outerHeight,scrollTop,scrollLeft
2010/03/23 Javascript
JavaScript使用过程中需要注意的地方和一些基本语法
2010/08/26 Javascript
JS获取图片实际宽高及根据图片大小进行自适应
2013/08/11 Javascript
使用javascript实现页面定时跳转总结篇
2013/09/21 Javascript
可以用鼠标拖动的DIV实现思路及代码
2013/10/21 Javascript
jQuery中:checkbox选择器用法实例
2015/01/03 Javascript
如何实现JavaScript动态加载CSS和JS文件
2020/12/28 Javascript
node.js回调函数之阻塞调用与非阻塞调用
2015/11/13 Javascript
实现React单页应用的方法详解
2016/08/02 Javascript
jQuery调用Webservice传递json数组的方法
2016/08/06 Javascript
EasyUI创建对话框的两种方式
2016/08/23 Javascript
js实现可旋转的立方体模型
2016/10/16 Javascript
Jquery AJAX POST与GET之间的区别详细介绍
2016/10/17 Javascript
JavaScript中object和Object的区别(详解)
2017/02/27 Javascript
浅谈webpack编译vue项目生成的代码探索
2017/12/11 Javascript
微信小程序显示倒计时功能示例【测试可用】
2018/12/03 Javascript
js实现ATM机存取款功能
2020/10/27 Javascript
Vue axios 跨域请求无法带上cookie的解决
2020/09/08 Javascript
Python实现端口复用实例代码
2014/07/03 Python
Python写的Socks5协议代理服务器
2014/08/06 Python
Python pip 安装与使用(安装、更新、删除)
2019/10/06 Python
python实现随机加减法生成器
2020/02/24 Python
Python3操作YAML文件格式方法解析
2020/04/10 Python
python 在threading中如何处理主进程和子线程的关系
2020/04/25 Python
原生 JS+CSS+HTML 实现时序图的方法
2019/07/31 HTML / CSS
捷克电器和DJ设备网上商店:Electronic-star
2017/07/18 全球购物
美国农场鲜花速递:The Bouqs
2018/07/13 全球购物
德国游戏机商店:Konsolenkost
2019/12/08 全球购物
《埃及的金字塔》教学反思
2014/04/07 职场文书
企业口号大全
2014/06/12 职场文书
植树节标语
2014/06/27 职场文书
同学聚会通知短信
2015/04/20 职场文书
2015年卫生院健康教育工作总结
2015/07/24 职场文书
MATLAB 如何求取离散点的曲率最大值
2021/04/16 Python