| Window.onload | $(document).ready() | |
|---|---|---|
| 执行时机 | 必须等待网页中所有的内容（包括图片）加载完毕后才能执行 | 网页中所有DOM结构绘制完毕就执行，可能DOM元素关联的东西并没有加载完 |
| 编写个数 | 不能同时编写多个，<br />以下代码无法正确执行：<br />Window.onload =function(){<br /> alert('test1');<br />} <br />Window.onload =function(){<br /> alert('test2');<br />}<br />结果只会输出"test2" | 能同时编写多个，<br />以下代码正确执行：<br />$(document).ready(){<br /> alert('hello world');<br />} <br />$(document).ready(){<br /> alert('hello again');<br />} <br />结果两次都输出 |
| 简化写法 | 无 | $(document).ready(){}<br />可以简化写成<br />$(function(){}) |
jquery链式操作代码块风格
子元素的操作推荐缩进
$(this).addClass('highlight')
.children('li').show().end()
.siblings().removeClass('highlight')
.children('li').hide()
事件冒泡(阻止事件冒泡和自身的默认行为)
$(element).bing('click', function(){ //点击事件的处理 event.stopPropagation(); //停止事件冒泡 })
页面某些元素有默认行为，比如submit的表单提交
event.preventDefault();//可以阻止元素的默认行为
只能使用一次的点击事件，用one绑定
$(element).one('click', function(){})
序列化元素
- serialize()
当表单中的内容比较多时，一个一个获取Input的内容显然是不合适的，此时就可以用到serialize()，例如
$('#form').serialize()
$(":checked,:radio").serialize()只会将选中的值序列化
$('#form').serializeArray()不是返回字符串了，而是返回json- $.param()方法
var obj = {a:1,b:2,c:3}
var k = $.param(obj)
此时k输出为a=1&b=2&c=3
- $(element).ajaxStart({})//ajax开始之前，比如在页面部分地方显示加载中。。。
- $(element).ajaxStop({})
JQuery validator
`//自定义一个验证方法
$.validator.addMethod(
"functionName",
function(value,element,param){
return value == eval(param)
},
'错误提示信息'
)
`
闭包
常见的JQuery插件写法
;(function($){ /*这里放置代码*/ })(jQuery);
jQuery判断浏览器类型
`$(document).ready(){
//Firefox 2 and above
if ( $.browser.mozilla && $.browser.version >= "1.8" ) {
//do something
}
//Safari
if ( $.browser.safari ) {
//do something
}
//Chrome
if ( $.browser.chrome ) {
//do something
}
//Opera
if ( $.browser.opera ) {
//do something
}
//IE6 and below
if ( $.browser.mise && $.browser.version <= "6" ) {
//do something
}
//anything above IE6
if ( $.browser.mise && $.browser.version > 6 ) {
//do something
}
}
`
