8.1 連接 jQuery
最後，我們來到了 jQuery 庫。到寫這篇文章的時候，它已經過時了，幾乎從未在新項目中使用過。但是有一段時間它非常流行，文檔非常豐富，並且在 Internet 上有很多使用它的示例。
因此，如果您正在編寫一個小型 Web 項目並且不想花數月時間學習現代框架，我建議您使用 jQuery 庫。
為了使用數以千計的 jQuery 函數，您只需要將它包含在您的頁面中。你可以這樣做：
<head>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
使用 jQuery 可以分為兩種類型。
首先，您可以獲得一個 jQuery 庫對象，它是包裝在自定義 jQuery 對像中的常規 HTML 元素。
其次，jQuery 有幾個不綁定到 HTML 元素的全局對象。它們也需要被使用。
讓我們從第一個開始。
8.2 使用選擇器
jQuery 使用選擇器來處理對象（還記得 CSS 及其類嗎？）。所以，在 jQuery 中，如果你想選擇某個對像或一組對象，你需要設置它們的選擇器。
例子：
| 代碼 | 描述 | 筆記 | |
|---|---|---|---|
| 1個 | $("股利") | 選擇所有帶有 DIV 標籤的對象 | 許多對象 |
| 2個 | $("img.#image123") | 選擇所有帶有 IMG 標籤和 ID == image123 的對象 | 一個對象 |
| 3個 | $("#image123") | 選擇 ID == image123 的所有對象 | 一個對象 |
| 4個 | $("div.文章") | 選擇所有帶有 DIV 標記且具有類文章的對象 | 許多對象 |
假設我們想為所有鏈接添加事件處理onclick，下面是我們如何使用 jQuery 來實現：
$("a").click(function() {
alert("Click");
});
這裡採取三個步驟：
- 獲取與選擇器匹配的對象
"a"。 - 我們創建一個調用
alert(). click我們將此函數設置為第 1 點中所有對象的事件處理程序。
jQuery 的另一個優點是它的代碼易於閱讀。弄清楚一切是如何工作的並不需要太多。如果有工作代碼，那麼很容易理解它的作用。
8.3 使用文檔元素
讓我們看一下使用 jQuery 處理文檔的幾個場景。
獲取元素的值（對於具有值的元素）：
var result = $ ("selector").value();設置元素值（對於有值的元素）：
$ ("selector").value(newValue);如何在某些元素中添加 HTML？
$ ("selector").html(newHTML);以及如何獲取元素內部的 HTML？
var html = $ ("selector").html();如果我想獲取/添加的不是 HTML，而是純文本怎麼辦？這裡也沒有驚喜。
var html = $ ("selector").text();如果我想獲取/更改元素的顏色怎麼辦？
$ ("selector").color("red");如果您需要使用樣式，那麼這也很容易做到：
$ ("selector").css("color", "red");如何添加新元素？
$ (".container").append($("h3"));
GO TO FULL VERSION