JavaScript 和 jQuery 混用

JavaScript window.onload 和 jQuery $(document).ready() 的差異

在撰寫頁面的 JavaScript 或 jQuery 時,通常會利用 window.onload 事件或 $(document).ready() 事件來確保 DOM 完全載入,不過兩者仍有以下差異。


window.onload 會等網頁的全部內容,包括圖片,CSS及 <iframe> 等外部內容都載入後才會觸發,但 $(document).ready() 在 Document Object Model (DOM) 載入後就會觸發,所以順序上$(document).ready() 會比 window.onload 先執行。


window.onload 是 JavaScript 的原生事件,而 $(document).ready() 是 jQuery 的事件(其實是透過監聽 JavaScript 的 DOMContentLoaded 事件來實現)。


window.onload 的用法如下:

window.onload = function() {

  // console.log("window loaded")

};


$(document).ready() 的用法如下:

$(document).ready(function() {

  console.log("document ready");

});

// 也可簡寫成

$(function() {

  console.log("document ready");

});



jQuery 轉為 JavaScript: var jsObject=$("#id").get(0);

JavaScript 轉為 jQuery: var $object=$(document.getElementById("id"));



JavaScript 呼叫 jQuery 方法:

function getResult(){

    $().getFuc();

};

$(function(){

    $.fn.getFuc=function(){

        alert("1111111111111");

    }

});


 jQuery 呼叫 JavaScript 方法:

$("#button3").click(function () {

        getFuc();

    });

function getFuc(){

       alert("111111");

}



在 HTML 中使用 onclick 方法與 jQuery 的事件監聽有何差異 (JS 亦能實現) ?

onclick 通常是在滿足以下條件時才優先於 .click 的方法:

1. 只有一個事件要為 click 事件註冊
2. 擔心移動性能/電池壽命

jQuery 以犧牲性能為代價來綁定所有事件。

如果我們談論性能,在任何情況下直接使用總是更快。


但倡導事件監聽的理由是 JavaScript 和 佈局(HTML) 應該分開
提倡者認為任何這些事件創建 evenHandler 是更好,一個事件可以捕獲多個項目,而不是為每個事件創建單獨的腳本



程式語言編年史

程式語言編年史原文 下面這張圖片描繪了整個程式語言的歷史。包括各種程式語言的發明人、程式語言的特點和適用領域、被什麼網站或公司使用等 (檢視 完整高清圖 )。 之所以會有那麼多不同的程式語言是因為設計程式語言的初衷不同、對語言學習曲線的追求不同、不同程式之間的執行成本差異...