zoukankan      html  css  js  c++  java

  • jquery选择器空格与大于号、加号与波浪号的区别

    空格：$('parent childchild')表示获取parent下的所有的childchild节点（所有的子孙）。

    大于号：$('parent > child')表示获取parent下的所有child的儿子( 第一代)。

    加号：$('pre + nextbrother')表示获得pre节点的下一个兄弟节点，相当于next()方法

    波浪号：$('pre ~ brother')表示获取pre节点的后面的所有兄弟节点，相当于nextAll()方法。 

    下面是一个小例子，看看他们的区别吧~~~~ (注意：代码测试效果不对，有时间再试试）

    [html] view plain copy
     
      1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
      2. <html>  
      3. <head>  
      4.     <title>New Document </title>  
      5.     <meta name="Generator" content="EditPlus">  
      6.     <meta name="Author" content="">  
      7.     <meta name="Keywords" content="">  
      8.     <meta name="Description" content="">  
      9.     <script src='f:/study/jquery.js'></script>  
      10.     <script>  
      11.         $(function () {  
      12.   
      13.             $("#b").append($("#a span").clone());  
      14.             $("#c").append($("#span12 + span").clone());  
      15.             $("#d").append($("#span12 ~ span").clone());  
      16.             $("#e").append($("#a > span").clone());  
      17.   
      18.         })  
      19.   
      20.     </script>  
      21. </head>  
      22.   
      23. <body>  
      24.     <div id='a'>  
      25.         <span>span1</span>  
      26.         <div>  
      27.             <span>span1.1</span>  
      28.             <span id='span12'>span1.2</span>  
      29.             <span>span1.3</span>  
      30.   
      31.             <span>span1.4</span>  
      32.             <span>span1.5</span>  
      33.             <span>span1.6</span>  
      34.         </div>  
      35.         <span>span2</span>  
      36.         <div>  
      37.             <span>span2.1</span>  
      38.             <span>span2.2</span>  
      39.             <span>span2.3</span>  
      40.             <span>span2.4</span>  
      41.             <span>span2.5</span>  
      42.             <span>span2.6</span>  
      43.         </div>  
      44.         <span>span3</span>  
      45.         <span>span4</span>  
      46.     </div>  
      47.     <hr>  
      48.     <div id='b'></div>  
      49.     空格：  
      50.   <hr>  
      51.     <div id='c'></div>  
      52.     +：  
      53.   <hr>  
      54.     <div id='d'></div>  
      55.     ~：  
      56.   <hr>  
      57.     <div id='e'>  
      58.         >  
      59.     </div>  
      60. </body>  
      61. </html>  
  • 相关阅读:
    ORACLE数据库逐步解决ORA-12541、ORA-01034和ORA-27101、ORA-00119和ORA00132的过程
    Windows下MySQL主从复制的配置
    Windows下Git的使用
    spring boot 2 集成JWT实现api接口认证
    spring boot 2 全局统一返回RESTful风格数据、统一异常处理
    spring boot 2 + shiro 实现权限管理
    Java 密码加盐
    Java中往zip压缩包追加文件
    IntelliJ IDEA 安装、配置和使用Lombok插件
    大规模微服务单元化与高可用设计
  • 原文地址：https://www.cnblogs.com/h2zZhou/p/7866260.html
Copyright © 2011-2022 走看看