• 【代码片段】jQuery测试更多元素集合


     1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
     2 <html>
     3 <head>
     4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     5 <title>第3章示例5</title>
     6 <style type="text/css">
     7     body { width:780px; }
     8     div,p,h3,span { border:4px solid black; background-color:green; color:white; float:left; margin:6px; padding:5px; font:bold 14px/1 Arial,Helvetica,sans-serif; width:220px; display:block; }
     9     div p,div span { width:205px; border-width:2px; margin:5px 0; float:none; }
    10     p span { width:193px; border-width:1px;}
    11     h3 { margin-right:500px; }    
    12     .clear { clear:both; }
    13     .relative { position:relative; }
    14     .highlight { background-color:gold; color:black; }    
    15     form { clear:both; font:bold 14px/1 Arial,Helvetica,sans-serif; }
    16     button { font:bold 16px/1 Arial,Helvetica,sans-serif; margin:1px 3px; padding:2px; cursor:pointer; }
    17 </style>
    18 <script src="http://code.jquery.com/jquery-1.9.1.min.js" type="text/javascript"></script>
    19 <script type="text/javascript">
    20     $(document).ready(function(){
    21         $("button").click(function(){$("*").removeClass("highlight");});
    22         $("#btn1").click(function(){$("div").add("p:last").addClass("highlight");});    
    23         $("#btn2").click(function(){$("body").children(":eq(3)").prevAll("[class]").andSelf().addClass("highlight");});    
    24         $("#btn3").click(function(){$("body").children(":eq(3)").prevAll("[class]").andSelf().andSelf().addClass("highlight");});
    25         $("#btn4").click(function(){$("body").children(":eq(3)").prevAll("[class]").andSelf().children("p").andSelf().addClass("highlight");});                                        
    26     });
    27 </script>
    28 </head>
    29 <body>
    30     <div class="clear">
    31         &lt;div class="clear"&gt;
    32         <p>
    33             &lt;p&gt;
    34             <span>&lt;span&gt; &lt;/span&gt;</span>
    35             &lt;/p&gt;
    36         </p>
    37         &lt;/div&gt;
    38     </div>
    39     <div>
    40         &lt;div&gt;
    41         <p>&lt;p&gt; &lt;/p&gt;</p>
    42         <p>&lt;p&gt; &lt;/p&gt;</p>
    43         <p>&lt;p&gt; &lt;/p&gt;</p>    
    44         &lt;/div&gt;
    45     </div>
    46     <div class="relative">
    47         &lt;div class="relative"&gt;
    48         <span>&lt;span&gt; &lt;/span&gt;</span>
    49         <span>&lt;span&gt; &lt;/span&gt;</span>
    50         <span class="clear">&lt;span class="clear"&gt; &lt;/span&gt;</span>            
    51         &lt;/div&gt;
    52     </div>
    53     <h3 class="clear">&lt;h3 class="clear"&gt; &lt;/h3&gt;</h3>    
    54     <div class="clear">
    55         &lt;div class="clear"&gt;
    56         <p>
    57             &lt;p&gt;
    58             <span>&lt;span&gt; &lt;/span&gt;</span>
    59             <span>&lt;span&gt; &lt;/span&gt;</span>
    60             &lt;/p&gt;
    61         </p>
    62         <p>
    63             &lt;p&gt;
    64             <span>&lt;span&gt; &lt;/span&gt;</span>
    65             <span>&lt;span&gt; &lt;/span&gt;</span>
    66             &lt;/p&gt;
    67         </p>
    68         &lt;/div&gt;
    69     </div>
    70     <div>
    71         &lt;div&gt;
    72         <p>&lt;p&gt; &lt;/p&gt;</p>
    73         <p>&lt;p&gt; &lt;/p&gt;</p>
    74         <p>&lt;p&gt; &lt;/p&gt;</p>        
    75         &lt;/div&gt;
    76     </div>
    77     <div class="relative">
    78         &lt;div class="relative"&gt;
    79         <span>&lt;span&gt; &lt;/span&gt;</span>
    80         <span>&lt;span&gt; &lt;/span&gt;</span>
    81         <span class="clear">&lt;span class="clear"&gt; &lt;/span&gt;</span>    
    82         &lt;/div&gt;
    83     </div>
    84     <form>
    85         <button type="button" id="btn1">$("div").add("p:last")</button>
    86         <button type="button" id="btn2">$("body").children(":eq(3)").prevAll("[class]").andSelf()</button>
    87         <button type="button" id="btn3">$("body").children(":eq(3)").prevAll("[class]").andSelf().andSelf()</button>
    88         <button type="button" id="btn4">$("body").children(":eq(3)").prevAll("[class]").andSelf().children("p").andSelf()</button>            
    89     </form>
    90 </body>
    91 </html>

  • 相关阅读:
    NHbiernate 配置
    NHibernate开发入门
    Thread 线程简单例子
    C#中委托和事件
    DataGridView 去掉多余的列
    ASP.NET C# 有程序集加不了解决办法
    oracle“记录被另一个用户锁住”
    Android 控件属性
    Android 入门
    MVC 视频笔记
  • 原文地址:https://www.cnblogs.com/kojya/p/2944941.html
Copyright © 2020-2023  润新知