jQuery加载事件
加载事件
javascript的加载事件：
<body onload = “函数()”>
window.onload = function(){}
jquery加载事件实现
① $(document).ready(function处理);
② $().ready(function处理);
③ $(function处理); 对第一种加载的封装而已
<!DOCTYPE html>
<html>
<head>
<title>php.cn</title>
<meta charset="utf-8" />
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<script>
//① $(document).ready(加载事件处理函数);
////$(document) 创建一个jquery对象，内部有dom组成部分：document
//$(document)[0]-------获得-------->document对象
$(document).ready(function(){
console.log(123);
});
//② $().ready(加载事件处理函数)
//$() 创建一个jquery对象，内部没有dom组成部分
$().ready(function(){
console.log(456);
});
//③ $(function加载事件处理函数);
$(function(){
console.log(789);
});
</script>
<style type="text/css">
</style>
</head>
<body>
</body>
</html> jquery加载事件与传统加载事件的区别
设置个数
在同一个请求里边，jquery的可以设置多个，而传统方式只能设置一个
传统方式加载事件是给onload事件属性赋值，多次赋值，后者会覆盖前者。
jquery方式加载事件是把每个加载事件都存入一个数组里边，成为数组的元素，执行的时候就遍历该数组执行每个元素即可，因此其可以设置多个加载事件。
执行时机不一样
传统方式加载事件，是全部内容(文字、图片、样式)在浏览器显示完毕再给执行加载事件。
jquery方式加载事件，只要全部内容(文字、图片、样式)在内存里边对应的DOM树结构绘制完毕就给执行，有可能对应的内容在浏览器里边还没有显示。
<!DOCTYPE html>
<html>
<head>
<title>php.cn</title>
<meta charset="utf-8" />
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<script>
window.onload = function(){
console.log('abc');
}
$(function(){
console.log('def');
});
</script>
<style type="text/css">
</style>
</head>
<body>
<h2>加载事件区别</h2>
</body>
</html>
女神的闺蜜爱上我
还有其他事件呢
8年前 添加回复 0