jQuery备忘录--私家版

最近在看jQuery，老是看过了忘，不知道该怎么办？准备开启洗脑模式，平常念一念，紧箍咒加身。

1.jQuery方法第一步：ready=》加载html的骨架。而onload=》整个页面加载完毕。因为兼容性问题，最后在jQuery变为：

$(document).ready();　

2.jQuery不报错！

 

3.必定要记住$()的结果是数组，数组！！jQuery选择器之后想要变成原生对象的话，取数组的0位.

$(document).ready(function(){
    var mydiv=$("#mydiv");//变成原生对象mydiv[0];
    $(document.getElementById("mydiv"));//原生js对象变成jQuery对象
});

4.事件代理 

$().click(function(){

})
$().on("click",function(){

})

　　两种点击事件的绑定呈现的效果同样，可是在jQuery的内部不同（具体还没查）。可是两种方法在处理动态绑定的时候不同，当咱们向html文档中append一个元素时，若是想点击这个元素的话，两种方法获取这个新添加的dom，立刻写的代码以下：

$(document).ready(function(){
    $("#myAdd").click(function(){
        console.log('myAdd');
    });
    $("#myAdd").on("click",function(){
        alert("myAdd");
    });
    $("#btn").on('click',function(){
        $(".test").append('<p id="myAdd">add</p>')
    });
});

　　可是上面的两种写法根本获取不到点击事件，由于是动态建立的对象，如今没有在dom树中，若是要获取他，必定要检测dom的变化，这时候on方法就体现出来了，他是jQuery保留下来的绑定事件，能够检测刷新dom结构，可是要对他有一点点的改动。以下，监听的是他的外层，而后在on的参数中写动态加载的元素。

$(".test").on('click','#myAdd',function(){
        alert('myAdd click success');
    });

　　这个就能够了。on方法是jQuery事件代理绑定的一个，还有一个是delegate。只是在写参数的时候，调换click和id的位置才能够，具体要看jQuery的版本。

5.修改css属性时，若要修改一批属性，记得用Object的形式。以下：

$().css({
        color:'',
        display:''
    });

6. 遍历方法each，记得经常使用相好this！

 

7. jQuery动画时，简单的动画能够用jQuery，复杂一点的用css动画形式，太复杂的用js！！

 

8. 页面渲染速度控制，要理解浏览器的渲染引擎原理

 

9.requestAnimationFrame经过递归调用同一方法来不断更新画面以达到动起来的效果，但它优于setTimeout/setInterval的地方在于它是由浏览器专门为动画提供的API，在运行时浏览器会自动优化方法的调用，而且若是页面不是激活状态下的话，动画会自动暂停，有效节省了CPU开销。

代码兼容性要判断浏览器是否是支持requestAnimationFrame，从而进行兼容，代码以下：

window.requestAnimationFrame = window.requestAnimationFrame || window.mozRequestAnimationFrame || window.webkitRequestAnimationFrame || window.msRequestAnimationFrame;

 

10.AJAX局部刷新，必定要记得顺序！

 

11.记得常看手册！！手册！！