iT邦幫忙

4

$document ready 和 $funcion 的迷思?要用哪個才對?以及使用的時間點?

$(document).ready(function() {

});
$(window).ready(function () {

});
$(window).load(function() {

});
$(window).on('load', function () {
     
});
$(function() {

});
(function($) {

})(jQuery);
jQuery(document).ready(function ($) {

});

想問一下要用哪個才對?還是有其他更好的?
以及使用的時間點?

另外我發現我把這個拔下來,js代碼還是可以運行...所以是要在什麼樣的情況下才需要使用?
再來就是看哪個最通用?

2 個回答

5
最佳解答

用這個最好,因為最精簡,其他可以忽略,使用的時間點在於確保html全部load完,
才開始執行js,避免js找不到html dom而發生錯誤,這種寫法等同把js寫在html之後

$(function() {
});
看更多先前的回應...收起先前的回應...
asys0512 iT邦研究生 5 級 ‧ 2018-08-16 10:25:30 檢舉

假設我js檔案很多個,每一個都要 $(function(){ 嗎?

是的,每個js檔案都是獨立,如果兩個js要使用同一個變數值,就把變數宣告成全域的,就這樣

fillano iT邦超人 1 級 ‧ 2018-08-16 14:47:17 檢舉

我記得放在</body>之前,其他dom元素之後就可以。根元素就是<html>,放在他之後有點怪,雖然也不會有問題啦。

可以放在之前,是因為dom都已載入了,而且tag只要載入開頭的tag,就算有載入成功,所才才會跟放在html外,使用上沒什麼區別吧

有一個前提,在直行該段程式碼,必須先載入jQuery,不然該段會因出錯而被忽略

asys0512 iT邦研究生 5 級 ‧ 2018-08-16 23:06:14 檢舉

我發現有些東西沒辦法這樣做...
好比我有一個檔案是放js function
like...


function (xxxxx){
    xxxxxx
}

我發現放了那個就會失效

function 也算是一個變數,如果要全域用,妳知道的,不知道就…/images/emoticon/emoticon05.gif

0
chaosfractal
iT邦新手 5 級 ‧ 2018-08-16 15:39:53

還有一種方式,假設不透過jQuery的方法,或不確定jQuery是否載入
除了IE8外,其他瀏覽器都支持

document.addEventListener("DOMContentLoaded", function(event) { 
  //do work
});

參考資料
https://stackoverflow.com/questions/799981/document-ready-equivalent-without-jquery

我要發表回答

立即登入回答