我的天空(I Like the feeling)

导航

JQuery入门(二)JQuery选择器(层级+属性)(1)(转)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>Jquery选择器(层级+属性)</title>
  <script type="text/javascript" language="JavaScript" src="../lib/jquery/jquery-1.3.2.js">
        </script>
  <link rel="stylesheet" type="text/css" href="../Default.css">
        <script type="text/javascript" language="JavaScript">
         $(document).ready(function(){
    
    //在给定的祖先元素下匹配所有的后代元素
//    $("form input").each(function(){
//     $("span").append("被选中的元素Name属性值为:"+$(this).attr("name")+"<br/>");
//    });
    
    //在给定的父元素下匹配所有的子元素,不包括孙子元素等其他后代元素
//                $("form>input").each(function(){
//     $("span").append("被选中的元素Name属性值为:"+$(this).attr("name")+"<br/>");
//    });
    
    //匹配在label元素后面的input原书
//                $("label + input").each(function(){
//     $("span").append("被选中的元素Name属性值为:"+$(this).attr("name")+"<br/>");
//    });
    
    //找到所有与表单同辈的 input 元素(级数深度一样的元素)
//    $("form ~ input").each(function(){
//     $("span").append("被选中的元素Name属性值为:"+$(this).attr("name")+"<br/>");
//    });
    
    //查找所有 name 属性包含 'man' 的 input 元素
//    $("input[name*='man']").each(function(){
//     $("span").append("被选中的元素Name属性值为:"+$(this).attr("name")+"<br/>");
//    });
    
    //查找所有 name 属性不是 newsletter 的 input 元素
//    $("input[name!='newsletter']").each(function(){
//     $("span").append("被选中的元素Name属性值为:"+$(this).attr("name")+"<br/>");
//    });

                //查找所有 name 属性不是 milkman 的 input 元素
//    $("input[name='milkman']").each(function(){
//     $("span").append("被选中的元素Name属性值为:"+$(this).attr("name")+"<br/>");
//    });
    
    //查找所有 name 属性以 'letter' 结尾的 input 元素
//    $("input[name$='letter']").each(function(){
//     $("span").append("被选中的元素Name属性值为:"+$(this).attr("name")+"<br/>");
//    }); 

                //查找所有 name 属性以 'letter' 结尾的 input 元素
//    $("input[name^='news']").each(function(){
//     $("span").append("被选中的元素Name属性值为:"+$(this).attr("name")+"<br/>");
//    });

                //查找所有含有 id 属性的 div 元素
//              $("div[id]").each(function(){
//     $("span").append("被选中的元素Name属性值为:"+$(this).text()+"<br/>");
//    });  

                //找到所有含有 id 属性,并且它的 name 属性是以 man 结尾的
//                $("input[id][name$='man']").each(function(){
//     $("span").append("被选中的元素Name属性值为:"+$(this).attr("name")+"<br/>");
//    });

   });
  </script>
 </head>
 <body>
  <span></span>
    <form>
        <label>
            Name:
        </label>
        <input name="name" />
        <fieldset>
            <label>
                Newsletter:
            </label>
            <input name="newsletter" />
        </fieldset>
    </form>
 <input name="none" />
 <div><input name="none1" /></div>
 <input name="none2" />
    <input name="man-news" />
 <input name="milkman" id="input1"/>
 <input name="letterman2" />
 <input name="newmilk" />
 <input name="newsboy" />
 <div></div>
 <div id="div1">div1</div>
 <div id="div2">div2</div>
 </body>
</html>

posted on 2009-10-22 09:09  TBLANK  阅读(735)  评论(0编辑  收藏  举报