jQuery 庫 - 特性
jQuery 是一個 JavaScript 庫。
jQuery 是一個 JavaScript 函數庫。
jQuery 庫包含以下特性:
- HTML 元素選取
- HTML 元素操作
- CSS 操作
- HTML 事件函數
- JavaScript 特效和動畫
- HTML DOM 遍歷和修改
- AJAX
- Utilities
下載 jQuery
有兩個版本的 jQuery 可供下載:
- Production version - 用于實際的網站中,已被精簡和壓縮。
- Development version - 用于測試和開發(未壓縮,是可讀的代碼)
這兩個版本都可以從 jQuery.com 下載。
-
替代方案
如果您不希望下載并存放 jQuery,那么也可以通過 CDN(內容分發網絡) 引用它。
谷歌和微軟的服務器都存有 jQuery 。
如需從谷歌或微軟引用 jQuery,請使用以下代碼之一:
-
庫的替代
Google 和 Microsoft 對 jQuery 的支持都很好。
如果您不愿意在自己的計算機上存放 jQuery 庫,那么可以從 Google 或 Microsoft 加載 CDN jQuery 核心文件。
-
jQuery 語法
jQuery 語法是為 HTML 元素的選取編制的,可以對元素執行某些操作。
基礎語法是:$(selector).action()
- 美元符號定義 jQuery
- 選擇符(selector)“查詢”和“查找” HTML 元素
- jQuery 的 action() 執行對元素的操作
示例
$(this).hide() - 隱藏當前元素
$("p").hide() - 隱藏所有段落
$(".test").hide() - 隱藏所有 class="test" 的所有元素
$("#test").hide() - 隱藏所有 id="test" 的元素
-
文檔就緒函數
您也許已經注意到在我們的實例中的所有 jQuery 函數位于一個 document ready 函數中:
$(document).ready(function(){ --- jQuery functions go here ---- });
這是為了防止文檔在完全加載(就緒)之前運行 jQuery 代碼。
如果在文檔沒有完全加載之前就運行函數,操作可能失敗。下面是兩個具體的例子:
- 試圖隱藏一個不存在的元素
- 獲得未完全加載的圖像的大小
-
jQuery 元素選擇器
jQuery 使用 CSS 選擇器來選取 HTML 元素。
$("p") 選取 <p> 元素。
$("p.intro") 選取所有 class="intro" 的 <p> 元素。
$("p#demo") 選取所有 id="demo" 的 <p> 元素。
jQuery 屬性選擇器
jQuery 使用 XPath 表達式來選擇帶有給定屬性的元素。
$("[href]") 選取所有帶有 href 屬性的元素。
$("[href='#']") 選取所有帶有 href 值等于 "#" 的元素。
$("[href!='#']") 選取所有帶有 href 值不等于 "#" 的元素。
$("[href$='.jpg']") 選取所有 href 值以 ".jpg" 結尾的元素。
文章列表