欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

jQuery中[attribute=value]選擇器用法實(shí)例

 更新時(shí)間:2014年12月31日 10:50:59   投稿:shichen2014  
這篇文章主要介紹了jQuery中[attribute=value]選擇器用法,實(shí)例分析了[attribute=value]選擇器的功能、定義及給定屬性及屬性值元素的使用技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下

本文實(shí)例講述了jQuery中[attribute=value]選擇器用法。分享給大家供大家參考。具體分析如下:

此選擇器能夠匹配帶有給定屬性和屬性值的元素。

語法結(jié)構(gòu):

復(fù)制代碼 代碼如下:
$("[attribute=value]")

參數(shù)列表:

參數(shù) 描述
attribute 定義要查找的屬性名稱。
value 定義要超找的屬性值。
引號在大多數(shù)情況下是可選的。但在遇到諸如屬性值包含"]"時(shí),用以避免沖突。

實(shí)例代碼:

實(shí)例一:

復(fù)制代碼 代碼如下:

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.dbjr.com.cn/" />
<title>[attribute=value]選擇器</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $("button").click(function(){
    $("li[id=third]").css("color","blue");
  })
})
</script>
</head>
<body>
<ul>
  <li id="first">html專區(qū)</li>
  <li id="second">Jquery專區(qū)</li>
</ul>
<ul>
  <li id="third">歡迎來到腳本之家</li>
  <li>腳本之家歡迎您</li>
</ul>
<button>點(diǎn)擊查看效果</button>
</body>
</html>

以上代碼可以li元素中id屬性值為third的li元素中的文本顏色設(shè)置為藍(lán)色。

實(shí)例二:

復(fù)制代碼 代碼如下:

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.dbjr.com.cn/" />
<title>[attribute=value]選擇器</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $("button").click(function(){
    $("li[id=thi]rd]").css("color","blue");
  })
})
</script>
</head>
<body>
<ul>
  <li id="first">html專區(qū)</li>
  <li id="second">Jquery專區(qū)</li>
</ul>
<ul>
  <li id="thi]rd">歡迎來到腳本之家</li>
  <li>腳本之家歡迎您</li>
</ul>
<button>點(diǎn)擊查看效果</button>
</body>
</html>

從以上代碼可以看出如何代碼中含有"["或者"]"的時(shí)候,必須要帶有引號,否則會造成匹配錯(cuò)誤。

希望本文所述對大家的jQuery程序設(shè)計(jì)有所幫助。

相關(guān)文章

  • jquery select2的使用心得(推薦)

    jquery select2的使用心得(推薦)

    下面小編就為大家?guī)硪黄猨query select2的使用心得(推薦)。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧
    2016-12-12
  • 輕松學(xué)習(xí)jQuery插件EasyUI EasyUI表單驗(yàn)證

    輕松學(xué)習(xí)jQuery插件EasyUI EasyUI表單驗(yàn)證

    輕松學(xué)習(xí)jQuery插件EasyUI,本文的重點(diǎn)在于EasyUI表單驗(yàn)證,并告訴大家如何提交表單,感興趣的小伙伴們可以參考一下
    2015-12-12
  • jQuery彈出層插件popShow用法示例

    jQuery彈出層插件popShow用法示例

    這篇文章主要介紹了jQuery彈出層插件popShow用法,結(jié)合實(shí)例形式分析了jQuery彈出層插件popShow的具體功能、用法與相關(guān)注意事項(xiàng),需要的朋友可以參考下
    2017-01-01
  • jQuery焦點(diǎn)圖切換特效代碼分享

    jQuery焦點(diǎn)圖切換特效代碼分享

    這篇文章主要介紹了jQuery焦點(diǎn)圖切換特效,圖片輪播效果特別適合做產(chǎn)品展示,豐富網(wǎng)頁內(nèi)容,感興趣的小伙伴可以參考下。
    2015-09-09
  • animate 實(shí)現(xiàn)滑動切換效果【實(shí)例代碼】

    animate 實(shí)現(xiàn)滑動切換效果【實(shí)例代碼】

    下面小編就為大家?guī)硪黄猘nimate 實(shí)現(xiàn)滑動切換效果【實(shí)例代碼】。小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧
    2016-05-05
  • JQuery實(shí)現(xiàn)鼠標(biāo)移動到圖片上顯示邊框效果

    JQuery實(shí)現(xiàn)鼠標(biāo)移動到圖片上顯示邊框效果

    鼠標(biāo)移動到圖片顯示邊框效果在瀏覽網(wǎng)頁的時(shí)候,大家也都見過,接下來使用jquery來實(shí)現(xiàn)這個(gè)功能,喜歡的朋友可以參考下
    2014-01-01
  • jquery實(shí)現(xiàn)表格行拖動排序

    jquery實(shí)現(xiàn)表格行拖動排序

    這篇文章主要為大家詳細(xì)介紹了jquery實(shí)現(xiàn)表格行拖動排序,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下
    2022-02-02
  • jQuery提交多個(gè)表單的小技巧

    jQuery提交多個(gè)表單的小技巧

    本節(jié)主要介紹了jQuery提交多個(gè)表單的小技巧,需要的朋友可以參考下
    2014-07-07
  • jqPlot Option配置對象詳解

    jqPlot Option配置對象詳解

    如果看過本文姊妹篇《jqPlot——基于jquery的圖表繪制工具》的朋友,應(yīng)該知道jqPlot大致的操作方法;如果還是不太清楚的話,可以參考jqPlot官方網(wǎng)站的使用方法介紹。
    2009-07-07
  • jQuery使用removeClass方法刪除元素指定Class的方法

    jQuery使用removeClass方法刪除元素指定Class的方法

    這篇文章主要介紹了jQuery使用removeClass方法刪除元素指定Class的方法,可實(shí)現(xiàn)針對指定元素樣式的批量刪除功能,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
    2015-03-03

最新評論