zoukankan      html  css  js  c++  java
  • 演示-JQuery关系选择器

     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 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     5 <title>index</title>
     6 <script type="text/javascript" src="jquery-3.1.1.min.js">
     7     
     8 </script>
     9 <script type="text/javascript">
    10     $(function(){
    11             console.log("选择div后代元素中的a元素,其长度为:"+$("div a").length);
    12             console.log("选择div子代元素中的a元素,其长度为:"+$("div>a").length);
    13             console.log("选择紧接div的子元素中的a元素,其长度为:"+$("div+a").length);
    14             console.log("选择div同代元素中的a元素,其长度为:"+$("div~a").length);
    15         }
    16     );
    17 </script>
    18 </head>
    19 <body>
    20 <div>
    21     <p>hello world!</p>
    22 </div>
    23 <div class="test" id="test" align="" style="background-color:#CCCCCC">
    24     <div>
    25         <a href="http://www.cnblogs.com/yw0219/p/5928955.html">JQuery选择器</a>
    26         <p><a href="http://www.cnblogs.com/yw0219/p/5928955.html">JQuery选择器</a></p>
    27     </div>
    28     <a href="http://www.cnblogs.com/yw0219/p/5928955.html">JQuery选择器</a>
    29 </div> 
    30 </body>
    31 </html>

    结果:

  • 相关阅读:
    学习C#泛型
    css半透明渐变过渡效果
    CSS Grid布局
    CSS writing-mode属性
    单点登录原理与简单实现
    linux磁盘挂载
    Fiddler抓包工具学习
    javascript事件机制之冒泡、捕获、传播、委托
    HTML行内元素、块状元素、行内块状元素的区别
    console.log详细介绍
  • 原文地址:https://www.cnblogs.com/yw0219/p/5929167.html
Copyright © 2011-2022 走看看