JQuery 选择器 xpath 语法应用


Posted in Javascript onMay 13, 2010

比如下面html代码

<ul> 
<li class="aaaa" title="ttt">li-1</li> 
<li class="bbbb">li-2</li> 
<li title="fffff">li-2</li> 
</ul> 
<div class="aaaa" title="ttt">li-1</div> 
<div class="bbbb">li-2</div> 
<div title="fffff">li-2</div>

第一种根据属性选择E[@attr]
$("[@title]").click()..........

即选择所有元素内 属性带有title的元素

<li class="aaaa" title="ttt">li-1</li>
<li title="fffff">li-2</li>
<div class="aaaa" title="ttt">li-1</div>
<div title="fffff">li-2</div>

$("div[@title]").click()..........

选择所有div标签下的所有带title的元素

<div class="aaaa" title="ttt">li-1</div>
<div title="fffff">li-2</div>

第二种根据属性值选择E[@attr=val]

$("div[@title=ttt]").click()................

选择div下所有title属性等于ttt的元素

<div class="aaaa" title="ttt">li-1</div>

如果是 $("[@title=ttt]").click()................

所有元素下属性title等于ttt的元素
<li class="aaaa" title="ttt">li-1</li>
<div class="aaaa" title="ttt">li-1</div>

第三种根据属性值开始字母选择E[@attr^=val]

$("div[@title^=t]").click()................

所有div元素下所有属性title值是以t为开头的元素

第三种根据属性值开始字母选择E[@attr$=val]

$("div[@title$=t]").click()................

所有div元素下所有属性title值是以t为结尾的元素

第三种根据属性值包含字母选择E[@attr*=val]

$("div[@title*=t]").click()................

所有div元素下所有属性title值是包含t的所有元素

第三种根据多个属性选择E[@attr=val][@attr=val]

$("div[@title=ttt][@class=aaaa]").click()................

所有div元素下所有属性title值是等于ttt并且属性class等于aaaa的元素

Javascript 相关文章推荐
js获取url中指定参数值的示例代码
Dec 14 Javascript
编程语言JavaScript简介
Oct 16 Javascript
ECMAScript6新增值比较函数Object.is
Jun 12 Javascript
使用Javascript判断浏览器终端设备(PC、IOS(iphone)、Android)
Jan 04 Javascript
温故知新——JavaScript中的字符串连接问题最全总结(推荐)
Aug 21 Javascript
详解使用jest对vue项目进行单元测试
Sep 07 Javascript
nvm、nrm、npm 安装和使用详解(小结)
Jan 17 Javascript
微信小程序实现简单表格
Feb 14 Javascript
vuex实现及简略解析(小结)
Mar 01 Javascript
ES10 特性的完整指南小结
Mar 04 Javascript
解决在Vue中使用axios用form表单出现的问题
Oct 30 Javascript
node.js如何自定义实现一个EventEmitter
Jul 16 Javascript
bgsound 背景音乐 的一些常用方法及特殊用法小结
May 11 #Javascript
通过判断JavaScript的版本实现执行不同的代码
May 11 #Javascript
JavaScript 判断指定字符串是否为有效数字
May 11 #Javascript
Jquery 获得服务器控件值的方法小结
May 11 #Javascript
超简单的jquery的AJAX用法
May 10 #Javascript
基于jquery用于查询操作的实现代码
May 10 #Javascript
jquery tab标签页的制作
May 10 #Javascript
You might like
PHP编码转换
2012/11/05 PHP
php过滤敏感词的示例
2014/03/31 PHP
php求数组全排列,元素所有组合的方法
2016/05/05 PHP
[原创]php正则删除html代码中class样式属性的方法
2017/05/24 PHP
PHP多进程通信-消息队列使用
2019/03/08 PHP
Laravel如何实现适合Api的异常处理响应格式
2020/06/14 PHP
JQuery上传插件Uploadify使用详解及错误处理
2010/04/27 Javascript
JavaScript Chart 插件整理
2010/06/18 Javascript
js中关于String对象的replace使用详解
2011/05/24 Javascript
JavaScript极简入门教程(一):基础篇
2014/10/25 Javascript
JS实现控制表格只显示行边框或者只显示列边框的方法
2015/03/31 Javascript
JavaScript中的getDay()方法使用详解
2015/06/09 Javascript
由ReactJS的Hello world说开来
2015/07/02 Javascript
避免jQuery名字冲突 noConflict()方法
2016/07/30 Javascript
JavaScript BASE64算法实现(完美解决中文乱码)
2017/01/10 Javascript
原生js实现无缝轮播图效果
2017/01/11 Javascript
详解支持Angular 2的表格控件
2017/01/19 Javascript
js实现自动图片轮播代码
2017/03/22 Javascript
微信小程序 request接口的封装实例代码
2017/04/26 Javascript
vue router demo详解
2017/10/13 Javascript
10行原生JS实现文字无缝滚动(超简单)
2018/01/02 Javascript
vue生命周期与钩子函数简单示例
2019/03/13 Javascript
Python 创建子进程模块subprocess详解
2015/04/08 Python
python模块之time模块(实例讲解)
2017/09/13 Python
Scrapy框架CrawlSpiders的介绍以及使用详解
2017/11/29 Python
JavaScript实现一维数组转化为二维数组
2018/04/17 Python
pandas 根据列的值选取所有行的示例
2018/11/07 Python
从一次项目重构说起CSS3自定义变量在项目的使用方法
2021/03/01 HTML / CSS
Html5实现首页动态视频背景的示例代码
2019/09/25 HTML / CSS
西班牙英格列斯百货英国官网:El Corte Inglés英国
2017/10/30 全球购物
求职自荐信范文格式
2013/11/29 职场文书
幼儿园保育员责任书
2014/07/22 职场文书
领导班子整改措施
2014/10/24 职场文书
团员年度个人总结
2015/02/26 职场文书
Java实战之用Swing实现通讯录管理系统
2021/06/13 Java/Android
Java实现房屋出租系统详解
2021/10/05 Java/Android