jquery选择器之内容过滤选择器详解


Posted in Javascript onJanuary 27, 2014

先写出DOM元素的HTML结构:

<style type="text/css">
    /*高亮显示*/
    .highlight{   
            background-color: gray
    }
</style>

<div>John Resign</div>
<div>George Martin</div>
<div>Malcom John Sinclair</div>
<div>J.Ohn</div>
<div></div>
<p></p>
<div><p>Has p</p></div>

一、:contains(text)
选取含有文本内容为“text”的元素
$("div:contains('John')").addClass("highlight"); //查找所有包含 "John" 的 div 元素

jquery选择器之内容过滤选择器详解
二、:empty
选取不含任何子元素或文本的空元素
用chrome浏览器审查元素可发现div为empty 的class样式已改变
$("div:empty").addClass("highlight");

jquery选择器之内容过滤选择器详解
三、:has(selector)
选取含有选择器所匹配的元素的元素
$("div:has(p)").addClass("highlight"); //查找所有包含p的div元素

jquery选择器之内容过滤选择器详解

四、:parent
选取含有子元素或者文本的元素标签

$("div:parent").addClass("highlight");  //查找所有含有子元素或者文本的div元素

jquery选择器之内容过滤选择器详解
Javascript 相关文章推荐
jQuery常见开发技巧详细整理
Jan 02 Javascript
Egret引擎开发指南之视觉编程
Sep 03 Javascript
innerHTML在IE中报错解决方案
Dec 15 Javascript
jQuery中wrapAll()方法用法实例
Jan 16 Javascript
浅谈javascript事件取消和阻止冒泡
May 26 Javascript
ui组件之input多选下拉实现方法(带有搜索功能)
Jul 14 Javascript
纯css下拉菜单 无需js
Aug 15 Javascript
JS获取鼠标相对位置的方法
Sep 20 Javascript
jquery.flot.js简单绘制折线图用法示例
Mar 13 Javascript
JQuery实现定时刷新功能代码
May 09 jQuery
详解vue-video-player使用心得(兼容m3u8)
Aug 23 Javascript
微信小程序地图实现展示线路
Jul 29 Javascript
jquery选择器之属性过滤选择器详解
Jan 27 #Javascript
jQuery自定义事件的简单实现代码
Jan 27 #Javascript
jQuery中bind与live的用法及区别小结
Jan 27 #Javascript
jQuery实现动画效果的简单实例
Jan 27 #Javascript
firefox下jquery ajax返回object XMLDocument处理方法
Jan 26 #Javascript
js修改原型的属性使用介绍
Jan 26 #Javascript
解决extjs grid 不随窗口大小自适应的改变问题
Jan 26 #Javascript
You might like
PHP实现的简易版图片相似度比较
2015/01/07 PHP
PHP文件上传、客户端和服务器端加限制、抓取错误信息、完整步骤解析
2017/01/12 PHP
解决thinkphp5未定义变量会抛出异常,页面错误,请稍后再试的问题
2019/10/16 PHP
jquery插件制作教程 txtHover
2012/08/17 Javascript
JS案例分享之金额小写转大写
2014/05/15 Javascript
绑定回车enter事件代码
2014/05/18 Javascript
jQuery实现DIV层淡入淡出拖动特效的方法
2015/02/13 Javascript
温习Javascript基础语法之词法结构
2016/05/31 Javascript
jQuery针对input的class属性写了多个值情况下的选择方法
2016/06/03 Javascript
Vue.js每天必学之过滤器与自定义过滤器
2016/09/07 Javascript
AngularJS入门教程之数据绑定原理详解
2016/11/02 Javascript
浅谈Nodejs中的作用域问题
2016/12/26 NodeJs
Vue.js组件通信的几种姿势
2017/10/23 Javascript
js中apply与call简单用法详解
2017/11/06 Javascript
JS监听事件的叠加和移除功能
2018/11/19 Javascript
简单了解TypeScript中如何继承 Error 类
2019/06/21 Javascript
新手入门js闭包学习过程解析
2019/10/08 Javascript
Python的print用法示例
2014/02/11 Python
详解python中的线程
2018/02/10 Python
使用Python爬了4400条淘宝商品数据,竟发现了这些“潜规则”
2018/03/23 Python
python实现对指定输入的字符串逆序输出的6种方法
2018/04/26 Python
PYTHON基础-时间日期处理小结
2018/05/05 Python
pandas 数据归一化以及行删除例程的方法
2018/11/10 Python
python批量下载网站马拉松照片的完整步骤
2018/12/05 Python
python getpass实现密文实例详解
2019/09/24 Python
python打包成so文件过程解析
2019/09/28 Python
部署Django到阿里云服务器教程示例
2020/06/03 Python
python如何获得list或numpy数组中最大元素对应的索引
2020/11/16 Python
BeautifulSoup获取指定class样式的div的实现
2020/12/07 Python
Python爬虫制作翻译程序的示例代码
2021/02/22 Python
法国包包和行李箱销售网站:Bagage24.fr
2020/03/24 全球购物
《陋室铭》教学反思
2014/02/26 职场文书
大龄毕业生求职别忘职业规划
2014/03/11 职场文书
《从现在开始》教学反思
2014/04/15 职场文书
体育教师教学随笔
2015/08/15 职场文书
Flask使用SQLAlchemy实现持久化数据
2021/07/16 Python