JQuery属性过滤器不完整

最新推荐文章于 2024-10-10 10:50:43 发布

aocezhi0403

最新推荐文章于 2024-10-10 10:50:43 发布

阅读量77

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/ponyblog/archive/2013/03/04/2943326.html

版权

 1 <!doctype html>
 2  <html>
 3  <head>
 4  <meta charset="utf-8">
 5  <script src="scripts/jquery-1.9.1.min.js"></script>
 6  <style>
 7  .ulcss {
 8      background-color:gray;
 9      font-size: 20px
10  }
11  </style>
12  <title>JQuery小技巧--属性过滤器不完整</title>
13  
14  <!-- 新窗口打开页面 -->
15  <script>
16  <!-- 将所有以 http:// 开头的链接从新窗口打开 -->
17  $(document).ready(function(){
18      //动态添加控件
19      $("<li><a href='http://www.sohu.com'>搜狐网</a></li>").appendTo("div.ulcss>ul");
20      $("div.ulcss>ul").append("<li><a href='http://www.163.com'>网易</a></li>"); 
21      
22      //JQuery [attribute=value] 属性过滤器，全字符匹配
23      $("a[rel='SelfViewOpen']").click(function(e){
24          //设置元素属性attr
25          $(this).attr("target","_self");
26        });
27      //JQuery [attribute!=value] 同 not([attr="value"])
28      //全字符匹配，取出属性以不包括指定字符串的元素
29      //取得不包含 http:// 字符串的并添加一段字符串
30      //[href*=value] 属性过滤，模糊匹配
31      $("a").not("[href*='http://']").append("<b>本地链接网站</b>");
32        
33      //JQuery [attribute^=value] 取出属性以指定字符串开头的元素
34      $("a[href^='http://']").attr("target","_blank");
35      //JQuery [attribute$=value] 取出属性以指定字符串结尾的元素
36      $("a[href$='edu.cn']").css("background-color","red").append("--教育网");
37      });   
38  </script>
39  
40  </head>
41  
42  <body>
43  <div class="ulcss"> <span>网站导航</span><br/>
44    <ul>
45      <li> <a href="http://www.cnblogs.com" rel="SelfViewOpen" >博客园</a> </li>
46      <li> <a href="http://www.###.edu.cn">不好意思说</a></li>
47      <li> <a href="#">没有 http://</a></li>
48    </ul>
49  </div>
50  <div id="div_display"></div>
51  </body>
52  </html>