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 jsonp 使用示例代码
Aug 12 Javascript
jQuery学习笔记之 Ajax操作篇(一) - 数据加载
Jun 23 Javascript
js验证身份证号有效性并提示对应信息
Oct 19 Javascript
JS读写CSS样式的方法汇总
Aug 16 Javascript
jQuery实现div跟随鼠标移动
Aug 20 jQuery
解决Vue页面固定滚动位置的处理办法
Jul 13 Javascript
jQuery实现弹窗下底部页面禁止滑动效果
Dec 19 jQuery
css配合JavaScript实现tab标签切换效果
Oct 11 Javascript
Angular8 Http拦截器简单使用教程
Aug 20 Javascript
vue-router重写push方法,解决相同路径跳转报错问题
Aug 07 Javascript
vue3.0自定义指令(drectives)知识点总结
Dec 27 Vue.js
字节飞书面试promise.all实现示例
Jun 16 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
substr()函数中文版
2006/10/09 PHP
图象函数中的中文显示
2006/10/09 PHP
php中大括号作用介绍
2012/03/22 PHP
php中使用$_REQUEST需要注意的一个问题
2013/05/02 PHP
PHP排序算法之堆排序(Heap Sort)实例详解
2018/04/21 PHP
Autocomplete Textbox Example javascript实现自动完成成功
2007/08/17 Javascript
jQuery中hover与mouseover和mouseout的区别分析
2015/12/24 Javascript
JS加载iFrame出现空白问题的解决办法
2016/05/13 Javascript
基于JavaScript实现Tab选项卡切换效果
2016/11/24 Javascript
微信小程序Server端环境配置详解(SSL, Nginx HTTPS,TLS 1.2 升级)
2017/01/12 Javascript
input框中自动展示当前日期yyyy/mm/dd的实现方法
2017/07/06 Javascript
基于JavaScript实现带数据验证和复选框的表单提交
2017/08/23 Javascript
如何理解Vue的render函数的具体用法
2017/08/30 Javascript
vue引入axios同源跨域问题
2018/09/27 Javascript
[28:57]EG vs VGJ.T 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/16 DOTA
零基础写python爬虫之使用urllib2组件抓取网页内容
2014/11/04 Python
说一说Python logging
2016/04/15 Python
python实现逻辑回归的方法示例
2017/05/02 Python
python合并同类型excel表格的方法
2018/04/01 Python
浅谈django orm 优化
2018/08/18 Python
Python 多线程不加锁分块读取文件的方法
2018/12/11 Python
python爬虫之验证码篇3-滑动验证码识别技术
2019/04/11 Python
python图形界面开发之wxPython树控件使用方法详解
2020/02/24 Python
python代码xml转txt实例
2020/03/10 Python
解决jupyter notebook import error但是命令提示符import正常的问题
2020/04/15 Python
Mountain Warehouse德国官网:英国户外零售商
2019/08/11 全球购物
俄罗斯儿童和青少年服装、鞋子及配件的在线商店:Orby
2020/02/20 全球购物
SQL注入攻击的种类有哪些
2013/12/30 面试题
两年的个人工作自我评价
2014/01/10 职场文书
产品推广策划方案
2014/05/10 职场文书
廉洁家庭事迹材料
2014/05/15 职场文书
广告学专业毕业生自荐信
2014/05/28 职场文书
英语投诉信范文
2015/07/03 职场文书
新闻报道稿范文
2015/07/23 职场文书
创业计划书之密室逃脱
2019/11/08 职场文书
MySQL 5.7常见数据类型
2021/07/15 MySQL