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 相关文章推荐
JavaScript Base64编码和解码,实现URL参数传递。
Sep 18 Javascript
js 深拷贝函数
Dec 04 Javascript
jquery获取元素值的方法(常见的表单元素)
Nov 15 Javascript
jquery查找tr td 示例模拟
May 08 Javascript
手机号码,密码正则验证
Sep 04 Javascript
JavaScript学习笔记之内置对象
Jan 22 Javascript
新入门node.js必须要知道的概念(必看篇)
Aug 10 Javascript
Node.js connect ECONNREFUSED错误解决办法
Sep 15 Javascript
js的OOP继承实现(必看篇)
Feb 18 Javascript
JS原生带小白点轮播图实例讲解
Jul 22 Javascript
基于node搭建服务器,写接口,调接口,跨域的实例
May 13 Javascript
javascript实现小型区块链功能
Apr 03 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
Win下如何安装PHP的APC拓展
2013/08/07 PHP
php函数传值的引用传递注意事项分析
2016/06/25 PHP
jquery 框架使用教程 AJAX篇
2009/10/11 Javascript
jQuery 源码分析笔记(6) jQuery.data
2011/06/08 Javascript
javascript异步编程的4种方法
2014/02/19 Javascript
为何JS操作的href都是javascript:void(0);呢
2015/11/12 Javascript
JavaScript——DOM操作——Window.document对象详解
2016/07/14 Javascript
Bootstrap轮播插件使用代码
2016/10/11 Javascript
深入理解React Native原生模块与JS模块通信的几种方式
2017/07/24 Javascript
vue.js移动端app之上拉加载以及下拉刷新实战
2017/09/11 Javascript
详解promise.then,process.nextTick, setTimeout 以及 setImmediate的执行顺序
2018/11/21 Javascript
Element实现表格嵌套、多个表格共用一个表头的方法
2020/05/09 Javascript
小程序实现背景音乐播放和暂停
2020/06/19 Javascript
[01:13:51]TNC vs Serenity 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
Python获取脚本所在目录的正确方法
2014/04/15 Python
Python 中开发pattern的string模板(template) 实例详解
2017/04/01 Python
Python3使用pandas模块读写excel操作示例
2018/07/03 Python
pandas ix &iloc &loc的区别
2019/01/10 Python
python使用selenium登录QQ邮箱(附带滑动解锁)
2019/01/23 Python
解决Pycharm调用Turtle时 窗口一闪而过的问题
2019/02/16 Python
python字符串中匹配数字的正则表达式
2019/07/03 Python
利用python清除移动硬盘中的临时文件
2020/10/28 Python
详解HTML5 Canvas绘制不规则图形时的非零环绕原则
2016/03/21 HTML / CSS
HearthSong官网:儿童户外玩具、儿童益智玩具
2017/10/16 全球购物
巴西购物网站:Submarino
2020/01/19 全球购物
巴西最大的运动品牌:Olympikus
2020/07/14 全球购物
工厂实习感言
2014/01/14 职场文书
司法所长先进事迹
2014/06/02 职场文书
年会邀请函范文
2015/01/30 职场文书
2019学校请假条格式及范文
2019/06/25 职场文书
演讲稿之开卷有益
2019/08/07 职场文书
springboot 启动如何排除某些bean的注入
2021/08/02 Java/Android
Python 数据结构之十大经典排序算法一文通关
2021/10/16 Python
Spring Boot DevTools 全局配置学习指南
2022/03/31 Java/Android
Linux中一对多配置日志服务器的详细步骤
2022/07/23 Servers
VW、VH适配移动端的解决方案与常见问题
2023/05/21 HTML / CSS