javascript - jquery 事件執行問題

Question

function tableColor() {
    alert(0) //这里执行
    $(".table tr:odd").css("background", "#f8f8f8");
}  

第一种写法：
tableColor();//执行alert(0),弹出“0”，表格颜色**没有变化**。

第二种写法：
$(function() {
    tableColor();请输入代码
})
//弹出“0”,表格颜色变化了。

為什麼不同寫法造成不同的結果，道理來說同一個函數不會只執行一半吧。

Answer 1

$(function(){
//這邊是頁面加載完後才執行的程式碼
})
你的第一種寫法是頁面還沒加載完就執行了,所以沒檢測到DOM就不會改變顏色了

Answer 2

第二種是.ready()的簡寫。具體的去查文件吧。

Answer 3

一般引用js都是放在裡面，
第一種寫法執行的時候，頁面還沒載入完，所以找不到$(".table tr:odd")這個選擇器；
第二種是在頁面載入完成後執行的，所以能改變選擇器的顏色。

要么採用第二種方法，要么把js引用加在頁面最後。

Answer 4

第一種寫法，在執行你的程式碼的時候，頁面上可能還沒有載入出來表格table 這個元素，所以就可能會出現沒有找到元素的情況，所以就沒有顏色變化。
第二種寫法是等頁面元素載入完成之後再執行你的程式碼，這樣就保證了頁面中已經載入出來所有的元素了，程式碼就能找到需要的元素，所以就會做出相應的變更了

Answer 5

$(function() {
    // DOM加载完毕
});

你兩次的區別在於，第一次在DOM沒有加載完畢調用$(".table tr:odd") 可能沒有獲取到對應元素，你可以打印出來看看，而第二次肯定獲取到了。

建議把 JS 代碼或引入的 JS 文件放在頁底部， 之前即可.

Answer 6

跟一樓回答的類似，第一種寫法，如果是放在.table標籤之前，在dom還沒加載之前就執行的話，可能$選擇器都找不到dom，也就改不了顏色了。

而第二種，建議查看jquery文檔描述，我這邊打不開jquery官網，翻一篇別的其他地方的
http://www.css88.com/jqapi-1....

Answer 7

1.你第一種中寫法是在document標籤未載入完成的情況下執行。換句話說你html沒有載入完，你就對其裡面.table tr:odd 加入樣式，js腳本就不知道這個物件是哪個，所以會綁undefine。元素沒有載入完成。但是function的語法沒有錯誤，所以還是會alert 0
2.$(function(){})執行，也就是等待html載入完成時候，才執行裡面的方法，這時候，html載入完了，js就補抓到該物件是哪個元素，所以可以設定樣式。
具體參考：http://www.w3school.com.cn/h.asp

Answer 8

此題終結

Answer 9

第一種寫法：
tableColor();//執行alert(0),彈出“0”，但是dom沒有選中，程式碼是逐行執行的

第二種寫法：是文件載入完成之後執行
$(function() {

tableColor();

})

結論，js的引入放在文檔底部，html內部js除了自訂函數，統一寫在$(function() {})裡面，確保文檔執行完畢js程式碼執行