Re: [問題] jquery ready
※ 引述《a613204 (胖胖)》之銘言：
: 大家好 想請問一下ready事件
: 如果我在html檔案裡面有嵌入<script>alert('1')</script>
: 然後有嵌入外部js
: 外部js的內容為
: $(function(){
: alert('2');
: })
: 出現的順序會是1 接著是2
: 在這邊想確定一下 jquery的ready事件會等html裡面內嵌的script執行完畢才會去跑嗎?
: 謝謝
→
11/15 17:36,
11/15 17:36
不要這樣做，請放在 body 裡面。
→
11/15 17:37,
11/15 17:37
→
11/15 17:37,
11/15 17:37
是這樣子：
<script>alert('1');</script><!-- (1) -->
<script src="remote.js"></script><!-- (2) -->
事實上 (1) 和 (2) 都執行了，而且當瀏覽器讀到 (1) 的時候
會先執行 (1) 裡面的程式，到你按下「確定」
才會繼續讀 (2) 。
讀到 (2) 的時候，瀏覽器會去下載 remote.js
然後執行以下的內容：
$(function() {
alert('2');
});
這段程式的意思是，宣告一個 anonymous function，
叫 jQuery 把這個 function 註冊給 ready callback
當整個 HTML 都解讀成 DOM 之後，就會執行這個 function
所以瀏覽器已經執行了這段程式碼（宣告 function 、註冊 ready callback），
只是沒有執行 callback ，因為 $() callback 是 jQuery 管理的，
要到整個 HTML 讀完才會由 jQuery 執行裡面的 callback。
<script> 裡面的程式是同步執行的，瀏覽器解讀 HTML 的時候
會停下來執行裡面的程式，執行完了，再繼續讀後面的 HTML 。
這是因為有的 script 裡面會執行 document.write()
這會改變 HTML 的內容，要是同時執行 script 和讀 HTML
就會造成 HTML 的內容跟預期的不一樣。
除非你用 <script async src="remote.js"></script>
這樣瀏覽器才不會卡在這裡。當然你裡面不要用 document.write() 。
結論：
兩段程式碼都已經被瀏覽器執行了，只是因為後者是註冊 callback ，
而瀏覽器讀到那邊的當下， ready callback 還沒被觸發，所以不會執行。
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 219.71.240.146
推
11/15 21:13, , 1F
11/15 21:13, 1F
→
11/15 21:14, , 2F
11/15 21:14, 2F
→
11/15 21:15, , 3F
11/15 21:15, 3F
→
11/15 21:16, , 4F
11/15 21:16, 4F
→
11/15 21:48, , 5F
11/15 21:48, 5F
→
11/15 21:52, , 6F
11/15 21:52, 6F
→
11/15 22:31, , 7F
11/15 22:31, 7F
→
11/15 22:31, , 8F
11/15 22:31, 8F
推
11/15 22:35, , 9F
11/15 22:35, 9F
→
11/15 22:36, , 10F
11/15 22:36, 10F
→
11/15 22:37, , 11F
11/15 22:37, 11F
→
11/15 22:38, , 12F
11/15 22:38, 12F
推
11/15 22:46, , 13F
11/15 22:46, 13F
推
11/17 23:11, , 14F
11/17 23:11, 14F
討論串 (同標題文章)
本文引述了以下文章的的內容：
完整討論串 (本文為第 2 之 2 篇)：