1*使用外部javascript文件 , 共享Web页面中相同的js代码.
比如用于表单获取第一个字段的焦点:
$(document).ready(function(){
$(":text")[0].focus(); //获取第一元素焦点
$('form').submit(function(){ //防止重复提交
var subButton = $(this).find(':submit');
subButton.attr('disabled',true);
subButton.val('真正提交中...');
});//end submit
})//end ready
保持风格一致 代码重用
2*优先使用变量
比如点击一段文本
$('p').click(function(){
$('p').css('color','#F636')
})
显然 , 这样写如果在页面中多个地方都用到这种颜色(数量很庞大) 当我们要修改的时候 , 不仅工作量大而且容易出错 , 不便维护 .
所以我们可以这样 做 把一个颜色存入一个变量中 如:
var pColor='#F636';
$(this).css('color','Pcolor')
这样做以后需要修改的时候 直接修改pColor的值即可 , 如果某些特定的地方需要别的颜色也可以这样做:
var pColor = "#F636" ;
var specialColor = pColor;
同样需要修改的时候 直接给specialColor变量重新赋值即可;
3*使用三元操作符(条件表达式?true返回结果1:false返回结果2) 代替 if-else
使代码简洁 用1行代码 替换 多行代码
亦可使用switch语句
switch(variable){
case 'value 1':
//do something;
break;
case 'value 2':
//do something;
break;
case 'value 3':
//do something;
break;
........
default://上面的条件全部不满足 执行
//do something;
}
4*关于对象的使用
比如 $('#abc'),每次我们要使用该元素的时候 都要求jQuery库去找页面中的一个或者多个元素 , 当我们再
次执行到这段代码的时候同样要求jQuery库执行同样的工作 , 如果我们把这个需要多次使用的元素($('#abc'))
存放到一个变量中 var ABC = $('#abc') ; 这样子执行一次后 该变量将会保存jQuery查找的整个结果 , 再次使
用的时候将不用麻烦JQuery库再处理一次 不让jQuery库做没必要的工作 ;