頁面載入和window.onloadcss
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>