JQUERY的屬性選擇符和自定義選擇符使用方法（二）
更新時(shí)間：2011年04月07日 20:14:09 作者：
屬性選擇符就是通過(guò)HTML元素的屬性選擇元素。如獲取所有鏈接的TITLE屬性，可以用$('a[title]')
例子：給鏈接中含用“wangorg"字符的鏈接文字加粗
css:
.abold{
font-weight:bold;
}
html:
$('document').ready(function(){
$('a[href*=wangorg]').addClass('abold');
})
屬性選擇也可以用組合方式：
$('a[href^=http]
[href*=wangorg]').addClass('abold')
自定義選擇符是JQUERY添加的獨(dú)有的完全不同的選擇符，語(yǔ)法與CSS中的偽類選擇符語(yǔ)法相同，即選擇符以一個(gè)冒號(hào)（：）開(kāi)頭。
如：從匹配的帶有wangorg類的div集合中選擇第2個(gè)項(xiàng)，則相應(yīng)語(yǔ)法：$('div.wangor:eq(1)')
用CSS的選擇符語(yǔ)法為$('div:nth-child(2)')
例子：將表格的偶數(shù)行的底色變?yōu)?ccc
CSS:
.alt{
backgroud-color:#ccc;
}
HTML:
$('document').ready(function(){
$('tr:odd').addClass('alt')
})
將網(wǎng)頁(yè)中的所有表格都變以上效果：
$('document').ready(function(){
$('tr:nth-child(even)').addClass('alt');
})
將表格中含有“wangorg"字符串的表格的字體加粗
$('document').ready(function(){
$('tr:contains(wangorg)').addClass('abold');
})
相關(guān)選擇器解釋：
:eq(index)
結(jié)果集中位于給定索引之后（大于該索引）的元素 （從0開(kāi)始）
:odd
結(jié)果集中所有奇數(shù)元素（從0開(kāi)始）
:even 結(jié)果集中所有偶數(shù)元素（從0開(kāi)始）
:nth-child(even)
作為其父元素第偶數(shù)個(gè)子元素的元素（從1開(kāi)始計(jì)數(shù)）
:contains(text) 包含給定文本text的元素。
css:
復(fù)制代碼 代碼如下:
.abold{
font-weight:bold;
}
html:
復(fù)制代碼 代碼如下:
$('document').ready(function(){
$('a[href*=wangorg]').addClass('abold');
})
屬性選擇也可以用組合方式：
$('a[href^=http]
[href*=wangorg]').addClass('abold')
自定義選擇符是JQUERY添加的獨(dú)有的完全不同的選擇符，語(yǔ)法與CSS中的偽類選擇符語(yǔ)法相同，即選擇符以一個(gè)冒號(hào)（：）開(kāi)頭。
如：從匹配的帶有wangorg類的div集合中選擇第2個(gè)項(xiàng)，則相應(yīng)語(yǔ)法：$('div.wangor:eq(1)')
用CSS的選擇符語(yǔ)法為$('div:nth-child(2)')
例子：將表格的偶數(shù)行的底色變?yōu)?ccc
CSS:
復(fù)制代碼 代碼如下:
.alt{
backgroud-color:#ccc;
}
HTML:
復(fù)制代碼 代碼如下:
$('document').ready(function(){
$('tr:odd').addClass('alt')
})
將網(wǎng)頁(yè)中的所有表格都變以上效果：
復(fù)制代碼 代碼如下:
$('document').ready(function(){
$('tr:nth-child(even)').addClass('alt');
})
將表格中含有“wangorg"字符串的表格的字體加粗
復(fù)制代碼 代碼如下:
$('document').ready(function(){
$('tr:contains(wangorg)').addClass('abold');
})
相關(guān)選擇器解釋：
:eq(index)
結(jié)果集中位于給定索引之后（大于該索引）的元素 （從0開(kāi)始）
:odd
結(jié)果集中所有奇數(shù)元素（從0開(kāi)始）
:even 結(jié)果集中所有偶數(shù)元素（從0開(kāi)始）
:nth-child(even)
作為其父元素第偶數(shù)個(gè)子元素的元素（從1開(kāi)始計(jì)數(shù)）
:contains(text) 包含給定文本text的元素。
相關(guān)文章
關(guān)于Jquery操作Cookie取值錯(cuò)誤的解決方法
使用JQuery操作cookie時(shí) 發(fā)生取的值不正確,結(jié)果發(fā)現(xiàn)cookie有四個(gè)不同的屬性，下面與大家分享下錯(cuò)誤的原因及解決方法2013-08-08
jquery實(shí)現(xiàn)按Enter鍵觸發(fā)事件示例
按Enter鍵觸發(fā)事件比如提交等等，下面有個(gè)不錯(cuò)的示例，感興趣的朋友可以參考下2013-09-09
jQuery多媒體插件jQuery Media Plugin使用詳解
這篇文章主要介紹了jQuery多媒體插件jQuery Media Plugin使用詳解,需要的朋友可以參考下2014-12-12
JQuery中$.each 和$(selector).each()的區(qū)別詳解
這篇文章主要介紹了JQuery中$.each 和$(selector).each()的區(qū)別詳解,本文給出了多個(gè)例子講解了它們之間的不同之處,需要的朋友可以參考下2015-03-03
JQuery和html+css實(shí)現(xiàn)帶小圓點(diǎn)和左右按鈕的輪播圖實(shí)例
下面小編就為大家?guī)?lái)一篇JQuery和html+css實(shí)現(xiàn)帶小圓點(diǎn)和左右按鈕的輪播圖實(shí)例。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-07-07
這篇文章主要介紹了jQuery獲取字符串中出現(xiàn)最多的數(shù) 的相關(guān)資料,需要的朋友可以參考下2016-02-02
使用jquery+CSS3實(shí)現(xiàn)仿windows10開(kāi)始菜單的下拉導(dǎo)航菜單特效
本文是基于jquery和css3實(shí)現(xiàn)的仿windows10開(kāi)始菜單的下拉導(dǎo)航菜單特效，代碼超簡(jiǎn)單，感興趣的朋友一起看看吧2015-09-09
jQuery Mobile開(kāi)發(fā)中日期插件Mobiscroll使用說(shuō)明
這篇文章主要介紹了jQuery Mobile開(kāi)發(fā)中日期插件Mobiscroll使用說(shuō)明,需要的朋友可以參考下2016-03-03
這篇文章主要介紹了jQuery對(duì)html元素取值與賦值的方法，有需要的朋友可以參考一下2013-11-11
jQuery.ajax 跨域請(qǐng)求webapi設(shè)置headers的解決方案
需要通過(guò)服務(wù)器端設(shè)置響應(yīng)頭、正確響應(yīng)options請(qǐng)求，正確設(shè)置 JavaScript端需要設(shè)置的headers信息方能實(shí)現(xiàn)，本文介紹的非常詳細(xì)，具有參考借鑒價(jià)值，需要的朋友可以參考下2016-08-08