• jQuery学习笔记整理


    一.子元素选择器.:nth-child:匹配父元素下的第N个子或者奇偶元素.注意:序号是从1开始的,而eq是从0开始计数的!它匹配的是前方选择器选择到的元素的父元素下面的第几个元素.例如:ul li:first-child:匹配的是<ul>下面的这个<li>的父元素的第一个孩子.判断是否为li.见下面的代码:

    <ul>
                <a href="#"></a>
                <li>
                    <ul>
                        <!--此行的li被选中,因为是其父类元素的第一个子元素,
                        如果将上面的选择条件改为ul>li:first-child的话,则没有元素被选中-->
                        <a><li></li></a>  
                        <li></li>
                    </ul>
                </li>
            </ul>

    二.jQuery的id选择器,class选择器,名称选择器也可以取交集,但是中间不能加逗号,也不能有任何空格!例如:$("div.div#one")

    三.jQuery对象的remove方法和detach和empty方法.empty方法与两者有本质的区别,empty方法删除的是选择器匹配的元素的子类元素,而保留选择器的元素(即该方法删除所有子类元素),remove方法会删除匹配的元素,并通过返回值返回.但是这个方法的返回的元素中会删除绑定的事件.(注意:只能删除在<script>标签中的事件,而绑定在标签上的事件将不会删除.)而detach方法则不会删除事件.

    四.body中的Onload函数和jQuery中的ready函数的区别:
      1.onload函数只能调用一次.如果多次调用,后调用的会把前者覆盖,ready方法可以多次调用
      2.ready函数在DOM加载完后就会调用,而onload方法需要等待大部分视频音频加载完才调用

    五.jQuery完成编码,有两组方法,encodeURI和decodeURI,以及encodeURIComponent和decodeURIComponent方法.

    <script type="text/javascript">
    //escape()不能直接用于URL编码,它的真正作用是返回一个字符的Unicode编码值。比如"春节"的返回结果是%u6625%u8282,escape()不对"+"编码 主要用于汉字编码。
    alert(escape("春节"));
    alert(unescape(escape("春节")));
    //encodeURI()是用来对URL编码的函数。 编码整个url地址,但对特殊含义的符号"; / ? : @ & = + $ , #"不进行编码。对应的解码函数是:decodeURI()。
    alert(encodeURI('http://baidu.com?hello=您好&word=文档'));
    alert(decodeURI(encodeURI('http://baidu.com?hello=您好&word=文档')));
    //encodeURIComponent() 能编码"; / ? : @ & = + $ , #"这些特殊字符。对应的解码函数是decodeURIComponent()。
    alert(encodeURIComponent('http://baidu.com?hello=您好&word=文档'));
    alert(decodeURIComponent(encodeURIComponent('http://baidu.com?hello=您好&word=文档'))); 
    </script>

    六.jQuery的移动元素可以有两种方法:例如:假定我们选中了一个div元素,需要把它移动到p元素后面。

      第一种方法是使用.insertAfter(),把div元素移动p元素后面:
      $('div').insertAfter($('p'));
      第二种方法是使用.after(),把p元素加到div元素前面:
      $('p').after($('div'));
      表面上看,这两种方法的效果是一样的,唯一的不同似乎只是操作视角的不同。但是实际上,它们有一个重大差别,那就是返回的元素不一样。第一种方法返回div元素,第二种方法返回p元素。需要根据需要,选择到底使用哪一种方法。

    七.jQuery的事件委托处理.

      javascript的事件模型,采用"冒泡"模式,也就是说,子元素的事件会逐级向上"冒泡",成为父元素的事件。也就是说,一个事件,如果在子元素上未定义某个事件,那么该事件会在其父类元素上一直向外传播,直到被处理或者到达对象层次的最顶层.例如,在处理一个表格的时候,假设表格有100行,每一行都要求点击的时候会触发事件,那么可能会写下面的代码:

    $("td").click(function() {
        alert("click!");
    });

      虽然可以这样做,但是这样做是及其没有效率的,由于事件的冒泡传播的特性,那么实际上可以这么处理:

    $("table").click(function() {
        alert("click!");//采用父类元素集中处理
    });

      这种方式大大的提高了效率.

    八.jQuery的一些提高性能的方法:

      1.少改动DOM结构,不要频繁使用.append()、.insertBefore()和.insetAfter()这样的方法。

      2.js的原生函数效率要高,用js提供的for,while循环速度要比$.each要快

      3.由于js采用的是链式作用域的规则,因此对于变量能够声明为较近的局部变量就这么声明.

  • 相关阅读:
    查找算法
    顺序表和链表
    队列
    Redis系列教材 (二)- 运行
    Redis系列教材 (一)- windows教程
    Maven系列教材 (十三)- Eclipse 中创建父子-聚合项目
    Maven系列教材 (十一)- 使用Eclipse导入一个Maven风格的SSM项目
    Maven系列教材 (十)- 使用Eclipse创建一个Maven风格的SSM项目
    Maven系列教材 (九)- 在Eclipse中创建maven风格的java web项目
    Maven系列教材 (八)- 用命令行创建Maven风格的java web项目
  • 原文地址:https://www.cnblogs.com/hlhdidi/p/6002506.html
Copyright © 2020-2023  润新知