JQUERY的属性选择符和自定义选择符使用方法(二)


Posted in Javascript onApril 07, 2011

例子:给链接中含用“wangorg"字符的链接文字加粗
css:

.abold{ 
font-weight:bold; 
}

html:
$('document').ready(function(){ $('a[href*=wangorg]').addClass('abold'); 
})

属性选择也可以用组合方式:
$('a[href^=http]
[href*=wangorg]').addClass('abold')

自定义选择符是JQUERY添加的独有的完全不同的选择符,语法与CSS中的伪类选择符语法相同,即选择符以一个冒号(:)开头。
如:从匹配的带有wangorg类的div集合中选择第2个项,则相应语法:$('div.wangor:eq(1)')
用CSS的选择符语法为$('div:nth-child(2)')
例子:将表格的偶数行的底色变为#ccc
CSS:

.alt{ 
backgroud-color:#ccc; 
}

HTML:
$('document').ready(function(){ $('tr:odd').addClass('alt') 
})

将网页中的所有表格都变以上效果:
$('document').ready(function(){ 
$('tr:nth-child(even)').addClass('alt'); 
})

将表格中含有“wangorg"字符串的表格的字体加粗
$('document').ready(function(){ 
$('tr:contains(wangorg)').addClass('abold'); 
})

相关选择器解释:
:eq(index)
结果集中位于给定索引之后(大于该索引)的元素 (从0开始)
:odd
结果集中所有奇数元素(从0开始)
:even 结果集中所有偶数元素(从0开始)
:nth-child(even)
作为其父元素第偶数个子元素的元素(从1开始计数)
:contains(text) 包含给定文本text的元素。
Javascript 相关文章推荐
Jquery实现仿新浪微博获取文本框能输入的字数代码
Feb 22 Javascript
Google Map V3 绑定气泡窗口(infowindow)Dom事件实现代码
Apr 26 Javascript
jquery监听div内容的变化具体实现思路
Nov 04 Javascript
深入理解JavaScript系列(41):设计模式之模板方法详解
Mar 04 Javascript
Knockout自定义绑定创建方法
Dec 26 Javascript
AngularJS删除路由中的#符号的方法
Sep 20 Javascript
微信小程序图片自适应支持多图实例详解
Jun 21 Javascript
简述Angular 5 快速入门
Nov 04 Javascript
AngularJS集合数据遍历显示的实例
Dec 27 Javascript
微信小程序中插入激励视频广告并获取收益(实例代码)
Dec 06 Javascript
JavaScript实现拖拽功能
Feb 11 Javascript
node创建Vue项目步骤详解
Mar 06 Javascript
Jquery Ajax的Get方式时需要注意URL地方
Apr 07 #Javascript
jquery对表单操作2
Apr 06 #Javascript
jQuery对表单的操作代码集合
Apr 06 #Javascript
24款非常有用的 jQuery 插件分享
Apr 06 #Javascript
jquery常用技巧及常用方法列表集合
Apr 06 #Javascript
jQuery参数列表集合
Apr 06 #Javascript
基于jQuery实现的Ajax 验证用户名是否存在的实现代码
Apr 06 #Javascript
You might like
php桌面中心(一) 创建数据库
2007/03/11 PHP
php实现分页工具类分享
2014/01/09 PHP
php实现复制移动文件的方法
2015/07/29 PHP
php关闭warning问题的解决方法
2016/05/17 PHP
php在linux环境中如何使用redis详解
2020/12/15 PHP
js触发select onchange事件的小技巧
2014/08/05 Javascript
JavaScript SHA512加密算法详细代码
2016/10/06 Javascript
jQuery autoComplete插件两种使用方式及动态改变参数值的方法详解
2016/10/24 Javascript
JS克隆,属性,数组,对象,函数实例分析
2016/11/26 Javascript
jquery中$.fn和图片滚动效果实现的必备知识总结
2017/04/21 jQuery
Nodejs进阶:express+session实现简易登录身份认证
2017/04/24 NodeJs
浅谈vue中慎用style的scoped属性
2017/11/28 Javascript
在 webpack 中使用 ECharts的实例详解
2018/02/05 Javascript
Vue-cli配置打包文件本地使用的教程图解
2018/08/02 Javascript
JS实现将对象转化为数组的方法分析
2019/01/21 Javascript
Layer组件多个iframe弹出层打开与关闭及参数传递的方法
2019/09/25 Javascript
浅谈vue项目利用Hbuilder打包成APP流程,以及遇到的坑
2020/09/12 Javascript
addEventListener()和removeEventListener()追加事件和删除追加事件
2020/12/04 Javascript
Python的lambda匿名函数的简单介绍
2013/04/25 Python
Python中使用SAX解析xml实例
2014/11/21 Python
python中学习K-Means和图片压缩
2017/11/20 Python
全面分析Python的优点和缺点
2018/02/07 Python
Python 解决中文写入Excel时抛异常的问题
2018/05/03 Python
Python 限定函数参数的类型及默认值方式
2019/12/24 Python
canvas版人体时钟的实现示例
2021/01/29 HTML / CSS
类和结构的区别
2012/08/15 面试题
妇科医生自荐信
2013/11/05 职场文书
办理信用卡工作证明
2014/01/11 职场文书
高中生期末评语
2014/01/28 职场文书
家长给孩子的评语
2014/01/30 职场文书
实习指导老师评语
2014/04/26 职场文书
知识竞赛拉拉队口号
2014/06/16 职场文书
党的群众路线教育实践活动领导班子整改措施
2014/09/30 职场文书
2014小学一年级班主任工作总结
2014/12/05 职场文书
什么是求职信?求职信应包含哪些内容?
2019/08/14 职场文书
ES6 解构赋值的原理及运用
2021/05/25 Javascript