页面载入和window.onload
1 1. jquery文件要在使用jquery的代码之前引入 2 3 2. js代码最好都放到body标签下面或者里面的最下面来写 4 5 3.window.onload 6 // window.onload = function () { 7 // $('.c1').click(function () { 8 // $(this).css({'background-color':'green'}); 9 // }) 10 // } 11 4.页面载入,$(function (){alert('xx');}) -- $(document).ready(function(){}); 12 页面载入与window.onload的区别 13 1.window.onload()函数有覆盖现象,必须等待着图片资源加载完成之后才能调用 14 2.jQuery的这个入口函数没有函数覆盖现象,文档加载完成之后就可以调用(建议使用此函数) 15 16 示例: 17 <!DOCTYPE html> 18 <html lang="en"> 19 <head> 20 <meta charset="UTF-8"> 21 <title>Title</title> 22 <script src="jquery.js"></script> 23 <script> 24 // 等待整个页面中的内容全部加载完成之后,触发window.onload对应的函数里面的内容 25 // window.onload 有覆盖现象,会被后面的window.onload给重新赋值 26 // window.onload = function () { 27 // $('.c1').click(function () { 28 // $(this).css({'background-color':'green'}); 29 // }) 30 // } 31 32 33 $(function () { 34 $('.c1').click(function () { 35 $(this).css({'background-color':'green'}); 36 }) 37 }); 38 39 </script> 40 <script src="xx.js"></script> 41 42 43 <style> 44 .c1{ 45 background-color: red; 46 height: 200px; 47 width: 200px; 48 } 49 </style> 50 </head> 51 <body> 52 53 <div class="c1"></div> 54 55 <img src="" alt=""> 56 57 58 </body> 59 60 </html>