jQuery属性过滤选择器的使用


属性过滤选择器根据给定的元素的某个属性获取元素，如ID，以“[”开始，以"]"结束。

示例：

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  2. <html xmlns="http://www.w3.org/1999/xhtml">  
  3. <head>  
  4.     <title>使用jQuery属性过滤选择器</title>  
  5.     <script language="javascript" type="text/javascript"   
  6.             src="../Jscript/jquery-1.5.2.js"></script>  
  7.     <style type="text/css">  
  8.            body{font-size:12px;text-align:center}  
  9.            div{float:left;border:solid 1px #ccc;margin:8px;width:65px;height:65px;display:none}  
  10.     </style>  
  11.     <script type="text/javascript">  
  12.            /* $(function(){ //显示所有含有id属性的元素  
  13.               $("div[id]").show(3000);  
  14.             })*/  
  15.            /* $(function(){ //显示所有属性title的值是"A"的元素  
  16.               $("div[title='A']").show(3000);  
  17.             })*/  
  18.           /* $(function(){ //显示所有属性title的值不是"A"的元素  
  19.               $("div[title!='A']").show(3000);  
  20.             })*/  
  21.             /* $(function(){ //显示所有属性title的值以"A"开始的元素  
  22.               $("div[title^='A']").show(3000);  
  23.             })*/  
  24.           /*  $(function(){ //显示所有属性title的值以"C"结束的元素  
  25.               $("div[title$='C']").show(3000);  
  26.             })*/  
  27.            /* $(function(){ //显示所有属性title的值中含有"B"的元素  
  28.               $("div[title*='B']").show(3000);  
  29.             })*/  
  30.             $(function(){ //显示所有属性title的值中含有"B"且属性id的值是"divAB"的元素  
  31.               $("div[id='divAB'][title*='B']").show(3000);  
  32.             })  
  33.     </script>  
  34. </head>  
  35. <body>  
  36.     <div id="divID">ID</div>  
  37.     <div title="A">Title A</div>  
  38.     <div id="divAB" title="AB">ID <br />Title AB</div>  
  39.     <div title="ABC">Title ABC</div>  
  40. </body>  
  41. </html>  
说明：show（）是Jquery库中得一个显示元素函数，括号中表示显示时间，单位是毫秒。show（2000）表示用2000毫秒显示。

相关内容