10.慎用 .live()方法（应该说尽量不要使用）
这是jQuery1.3.1版本之后增加的方法，这个方法的功能就是为 新增的DOM元素 动态绑定事件。但对于效率来说，这个方法比较占用资源。所以请尽量不要使用它。例如有这么一段代码:
以下是引用片段：
<script type="text/javascript" >
$(function(){ $("p").click(function(){
alert( $(this).text() ); });
$("button").click(function(){
$("<p>this is second p</p>").appendTo("body"); });
}) </script> <body> <p>this is first p</p>
<button>add</button> </body>
运行后，你会发现新增的p元素，并没用被绑定click事件。你可以改成.live("click")方式解决此问题，代码如下：
以下是引用片段：
$(function(){ $("p").live("click",function(){
//改成live方式
alert( $(this).text() ); });
$("button").click(function(){ $("<p>this is second p</p>").appendTo("body"); });})
但我并不建议大家这么做，我想用另一种方式去解决这个问题，代码如下：
以下是引用片段：
$(function(){ $("p").click(function(){
alert( $(this).text() ); });
$("button").click(function(){
$("<p>this is second p</p>").click(function(){
//为新增的元素重新绑定一次
alert( $(this).text() );
}).appendTo("body"); }); })
虽然我把绑定事件重新写了一次，代码多了点，但这种方式的效率明显高于live()方式，特别是在频繁的DOM操作中，这点非常明显。
11.子选择器和后代选择器
后代选择器经常用到，比如：$("#list p");后代选择器获取的是元素内部所有元素。而有时候实际只要获取子元素，那么就不应该使用后代选择器。应该使用子选择器，代码如下：
以下是引用片段：
$("#list > p");
12.使用data()方法存储临时变量
下面是一段非常简单的代码：
以下是引用片段：
$(function(){
var flag = false;
$("button").click(function(){
if(flag){
$("p").text("true");
flag=false;
}else{
$("p").text("false");
flag=true;
} }); })
改用data()方式后，代码如下：
以下是引用片段：
$(function(){
$("button").click(function(){
if( $("p").data("flag") ){
$("p").text("true");
$("p").data("flag",false);
}else{
$("p").text("false");
$("p").data("flag",true);
}
});
})
您可能感兴趣的文章: