2022-12-28|閱讀時間 ‧ 約 3 分鐘

jQuery:載入內容

jquery載入內容方式有兩種:

第一種是你網頁內容物件載入正確之後才執行，程式碼如下:

$(document).ready(function(){

　　//內容

});

第二種是全部的網頁內容載入後才執行，程式碼如下:

$(window).load(function() {

　　//內容

});

以下為範例:

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>JQUERY</title>

　　<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js"></script>

　　<script>

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

    　　    console.log('load');

});

    　　$(document).ready(function() {

        　　console.log( "ready!" );

});

　　</script>

</head>

<body>

</body>

</html>

在這個情況下因為沒有甚麼資源需要讀取

所以第二種的速度會優於第一種

但我自己寫了這幾年以來

大多都是以第一種方式居多

第二種方式比較少用到

以前的編輯器都沒有一些指令與記憶的功能

我都會另外把這些東西複製在某個地方方便複製貼上(這就是這篇文章之前為什麼會出現的原因)

現在編輯器進步很多，基本上是不用這樣做了

但還是簡單分享一下喔

參考資料:

1.https://ithelp.ithome.com.tw/articles/10092601

2.https://blog.miniasp.com/post/2010/07/24/jQuery-ready-vs-load-vs-window-onload-event

分享至

成為作者繼續創作的動力吧！

從 Google News 追蹤更多 vocus 的最新精選內容

林信嘉的沙龍的其他內容

成為會員後即可發表留言