Jquery学习札记

Jquery学习笔记

1,jquery通过返回“this”关键字，返回一个jquery对象，便可以使jquery可以优雅地使用链式访问jquery方法。

2，jquery对象索引返回的是DOM对象，可以使用$()将其转换成jquery对象，如：$($("img")[0]).size();

3,jquery内部使用javascript原生态的getElementById()方法，所以ID选择是最快的，应尽量选择从ID开始的选择器

4，保存选择对象，尽量减少选择器使用次数如：

    $('div').each(function(){

            var _self = $(this);

            _self.click(function(){

            alert('click');

        });

        _self.find('span').css('color','red');

    });

 

5,标准DOM的createElemenmt()方法与innerHTML()方法创建DOM对象效率对比

   当需要插入多个元素，并且可以在插入前构造完整的HTML代码时，使用innerHTML一次插入所有元素可以极大提高效率。如果需要分别插入元素则使用createElement()方法。

   DOM方法：

        var startDate = new Date();

        for(var i = 0;i<100;i++){

            var oDiv = document.createElement("div");

            var oText = document.createTextNode("text");

            oDiv.appendChild(oDiv);

            oDiv.style.height = "100px";

            oDiv.style.height = "20px";

            oDiv.style.backgroundColor = "#eee";

        };

        this.holder.innerHTML += "<br/>使用createElement耗时:"+(new Date() - startDate);

   innerHTML()方法：

        createDom1:function(){

        var startDate = new Date();

        var builder = new Array();

        for(var i = 0;i<100;i++){

            builder.push("<div style='width:100px;height:20px;background-color:#eee'>test</div>");

        };

        this.holder.innerHTML = builder.join("");

        this.holder.innerHTML += "使用innerHTML耗时"+(new Date() - startDate);

        } 

6,filter()与find()的区别

        filter()对自身集合元素筛选

        find()是对它的子集操作。


7，强大的串联操作函数andSelf()与end();