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 相关文章推荐
artDialog 4.1.5 Dreamweaver代码提示/补全插件 附下载
Jul 31 Javascript
利用JS延迟加载百度分享代码,提高网页速度
Jul 01 Javascript
JS+CSS设置img在DIV中只显示Img垂直居中的部分
Oct 24 Javascript
jQuery无缝轮播图代码
Dec 22 Javascript
20行JS代码实现网页刮刮乐效果
Jun 23 Javascript
javascript获取指定区间范围随机数的方法
Sep 08 Javascript
Vue2.0 事件的广播与接收(观察者模式)
Mar 14 Javascript
详解在vue-cli中使用graphql即vue-apollo的用法
Sep 08 Javascript
微信小程序云开发修改云数据库中的数据方法
May 18 Javascript
Vue 无限滚动加载指令实现方法
May 28 Javascript
JavaScript前端实现压缩图片功能
Mar 06 Javascript
vue操作dom元素的3种方法示例
Sep 20 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获取远程图片并把它保存到本地的代码
2008/04/07 PHP
php中文字符串截取方法实例总结
2014/09/30 PHP
详解PHP中的外观模式facade pattern
2018/02/05 PHP
详细分析PHP 命名空间(namespace)
2020/06/30 PHP
Javascript 读书笔记索引贴
2010/01/11 Javascript
Javascript 实用小技巧
2010/04/07 Javascript
从QQ网站中提取的纯JS省市区三级联动菜单
2013/12/25 Javascript
基于Bootstrap重置输入框内容按钮插件
2016/05/12 Javascript
BootStrap中的表单大全
2016/09/07 Javascript
javaScript中定义类或对象的五种方式总结
2016/12/04 Javascript
jQuery滑动到底部加载下一页数据的实例代码
2017/05/22 jQuery
Vue.Draggable实现拖拽效果
2020/07/29 Javascript
iscroll-probe实现下拉刷新和下拉加载效果
2017/06/28 Javascript
jQuery实现的简单日历组件定义与用法示例
2018/12/24 jQuery
vue-cli+axios实现文件上传下载功能(下载接收后台返回文件流)
2019/05/10 Javascript
[01:28]2014DOTA2国际邀请赛中国区预选赛四大豪门直升机抵达会场
2014/05/24 DOTA
Python冒泡排序注意要点实例详解
2016/09/09 Python
Python基于Socket实现的简单聊天程序示例
2017/08/05 Python
对python中类的继承与方法重写介绍
2019/01/20 Python
Python把对应格式的csv文件转换成字典类型存储脚本的方法
2019/02/12 Python
Python标准库使用OrderedDict类的实例讲解
2019/02/14 Python
基于Python实现体育彩票选号器功能代码实例
2020/09/16 Python
10个很棒的 CSS3 开发工具 推荐
2011/05/16 HTML / CSS
SQL Server提供的3种恢复模型都是什么? 有什么区别?
2012/05/13 面试题
高中生职业生涯规划书
2014/02/24 职场文书
烹饪大赛策划方案
2014/05/26 职场文书
节能标语大全
2014/06/21 职场文书
党的生日演讲稿
2014/09/10 职场文书
团党委领导干部党的群众路线教育实践活动个人对照检查材料思想汇
2014/10/05 职场文书
简单的离婚协议书范本
2014/11/16 职场文书
巾帼文明岗事迹材料
2014/12/24 职场文书
先进党支部事迹材料
2014/12/24 职场文书
幼儿园开学温馨提示
2015/07/15 职场文书
田径运动会广播稿
2015/08/19 职场文书
Oracle使用别名的好处
2022/04/19 Oracle
vue 自定义组件添加原生事件
2022/04/21 Vue.js