jQuery 和 JavaScript 之間的區別是什麼？

JavaScript 和 jQuery 都服務於同一個首要目標，即使網頁更具互動性和動態性。它們賦予網站活力。如果它們服務於相同的功能並以相同的方式使用，人們可能會問為什麼需要兩個不同的概念。通讀本文以瞭解 jQuery 與 JavaScript 的區別。

什麼是 JavaScript？

JavaScript 是一種輕量級的程式語言，最常作為網頁的一部分使用。其網頁實現允許客戶端指令碼與使用者互動並建立動態網站。它是一種解釋型程式語言，可以處理面向物件的特性。

JavaScript 是解釋型的，因此它非常輕量級。
它旨在開發專注於網路的應用程式。
它與 HTML 互補並完全整合。
它可以在多個作業系統上免費使用。

JavaScript 開發工具

許多不同的製造商開發了一些非常有用的 JavaScript 編輯工具，以使我們的生活更輕鬆。

Microsoft FrontPage

Microsoft 負責建立 FrontPage，這是一種廣泛使用的 HTML 編輯器。此外，Web 開發人員可以在 FrontPage 中訪問各種 JavaScript 工具，這些工具可以幫助他們建立動態網站。

在專業 Web 開發領域，Macromedia Dreamweaver MX 是一款非常著名且廣泛使用的 HTML 和 JavaScript 編輯器。它符合 XHTML 和 XML 等現代標準，包含許多有用的預構建 JavaScript 元件，並有效地連線到資料庫。

Macromedia HomeSite 5

HomeSite 5 是一款廣受歡迎的 HTML 和 JavaScript 編輯器，由 Macromedia 開發。它是一個可以用來有效管理單個網站的工具。

建立互動式網頁通常需要使用 JavaScript。其主要應用包括：

客戶端驗證，
動態下拉選單，
包含日期和時間，
顯示出現的新的視窗和對話方塊（如警報對話方塊、確認對話方塊和提示對話方塊），
包含時鐘等。

示例

這是一個 JavaScript 程式碼示例：

<script>
   document.write("this text in to JavaScript");
</script>

什麼是 jQuery？

jQuery 是一個由 John Resig 於 2006 年開發的 JavaScript 庫。它以其速度和簡潔性而聞名，jQuery 使瀏覽 HTML 頁面、處理事件、使用動畫和與 Ajax 互動變得更容易，從而使構建網站的速度更快。

jQuery 是一個高效、輕量級且體積緊湊的 JavaScript 庫。它與多個作業系統和瀏覽器相容，使其成為跨平臺的。它也被稱為“少寫程式碼，多做事”，這是它的另一個名稱。因為它承擔了許多常見任務，這些任務通常需要大量 JavaScript 程式碼才能完成，

jQuery 的特性

以下是 jQuery 的一些重要特性：

**DOM 操作** - 使用名為 **Sizzle** 的跨瀏覽器開源選擇引擎，jQuery 使選擇 DOM 元素、遍歷它們以及編輯其內容變得簡單。這是透過 DOM 操作功能實現的。
**事件處理** - jQuery 庫提供了一種簡單的方法來捕獲各種事件，例如使用者點選連結，而無需在 HTML 程式碼本身中使用事件處理程式。當用戶點選連結時，就是一個這樣的事件示例。
**支援多個瀏覽器** - jQuery 支援多個瀏覽器，並且在 Internet Explorer 6.0 及更高版本、Firefox 2.0 及更高版本、Safari 3.0 及更高版本、Chrome 和 Opera 9.0 及更高版本上執行良好。
**相容性** - jQuery 相容 CSS3 選擇器以及基本 XPath 語法。

除此之外，jQuery 還提供其他功能，例如 HTML 修改、DOM 操作和 DOM 元素選擇、CSS 修改效果和動畫的實用程式、AJAX 和 HTML 事件方法、JSON 解析、透過附加元件或外掛擴充套件等。

將 jQuery 付諸實踐

使用 jQuery 有兩種不同的方法：

**在本地系統上安裝** 您可以透過下載庫並將其包含在 HTML 程式碼中來在本地計算機上安裝 jQuery。
**基於 CDN 的安裝**
如果要這樣做，您可以直接從內容分發網路 (CDN) 將 jQuery 庫包含到 HTML 程式碼中 (CDN)。

示例

這是一個 jQuery 示例：

<script src="https://tutorialspoint.tw/jquery/jquery-3.6.0.js"></script>
<script>
   $(document).ready(function() {
      document.write("this text in to jQuery");
   });
</script>