* Definition:
- A JavaScript Library.
- 為事件處理特别設計的。
* jQuery library 包含以下特性：
- HTML 元素選取
- HTML 元素操作
- CSS 操作
- HTML 事件函数
- JavaScript 特效和動畫
- HTML DOM traversal and modification
- AJAX
- Utilities
* Google 的 CDN
<head> </head>
* HTML 元素默認是靜態定位，且無法移動。如需使元素可以移動，請把 CSS 的 position 設置為 relative 或 absolute。
[Selector]
* 基礎語法是：$(selector).action()
* 以 $ 符號做為間接方式，但有可能某些其他 JavaScript Library 中的函数（比如 Prototype）同樣使用 $ 符號而發生符號衝突。因此可以使用 noConflict() 定義自己的名稱來取代 $ 符號，如下:
var jq=jQuery.noConflict()
* 使用 CSS selector 來選取 HTML 元素。ex:
- $("p") 選取所有<p>元素。
- $("p.intro") 選取所有 class="intro" 的<p>元素。
- $("p#demo") 選取 id="demo" 的第一個 <p>元素。
* 使用 XPath 表達式來選擇带有给定屬性的元素。
- $("[href]") 選取所有带有 href 屬性的元素。
- $("[href='#']") 選取所有带有 href 值等於 "#" 的元素。
- $("[href!='#']") 選取所有带有 href 值不等於 "#" 的元素。
- $("[href$='.jpg']") 選取所有 href 值以 ".jpg" 结尾的元素。
* " * Selector"
- 表示選取文檔中的每個單獨的元素，包括 html、head 和 body。
- 如果與其他元素一起使用，該 selector 選取指定元素中的所有子元素。
- 但某些 bowser 處理 * 的速度缓慢。
* 不要使用數字開頭的 ID 名稱！在某些瀏覽器中可能出问題。
* :empty
- 選取空的元素。
- 空元素指的是不包含子元素或文本的元素。
- 除以下幾種情况之外的元素即是可見元素：
- display:none
- type="hidden"
- Width 和 height 等於 0
- 隱藏的父元素（同時隱藏所有子元素）
* $("[attribute]")
選擇每個带有指定属性的元素。
* :text: 選取類型為 text 的 <input> 元素。
[Callback function]
* 在當前動畫 100% 完成之後才執行。
* 由於 JavaScript 語句是逐一執行的，所以因為動畫還沒完成，動畫之後的語句可能會產生錯誤或頁面衝突。為了避免這個情况，可以以参數的形式添加 Callback 函數。
* callback 参數是一個在操作完成後被執行的函数。
[Action]
* delegate()
適用於當前或未来的元素（比如由脚本創建的新元素）。
* load()
- 當指定的元素（及子元素）已加載時，會發生 load() 事件。
- 此事件適用於任何带有 URL 的元素（比如圖像、脚本、框架）。
- 根據不同的瀏覽器，如果圖像已被缓存，則也許不會觸發 load 事件。
- 是一種簡單的（但很强大的）AJAX 函数。語法如下：
$(selector).load(url,data,callback) // url: 指定數據的 web 地址。 // 只有希望向 server 發送數據時，才需要使用 data 参數; 需要在執行完畢後觸發一個函數時，才需要使用 callback。
* append()
- 在被選元素的结尾（仍然在内部）插入指定内容。
- append() 和 appendTo() 作用相同。不同之處在於：内容的位置和selector。
* detach()
- 移除被選元素，包括所有文本和子節點。
- 會保留 jQuery 對象中的匹配的元素，因而可以在將來再使用這些匹配的元素。
- 會保留所有绑定的事件、附加的數據，這一點與 remove() 不同。
* remove()
- 移除被選元素，包括所有文本和子節點。
- 不會把匹配的元素從 jQuery 對象中删除，因而可以在將來再使用這些匹配的元素。
- 但除了保留元素本身外，不會保留元素的 jQuery 數據。其他的比如绑定的事件、附加的數據等都會被移除。與 detach() 不同。
* text()
- 返回或設置被選元素的内容 (inner HTML)。
- 與 html() 類似，但是不會對 tag 轉譯，皆視為純文字。
- 如果該方法未設置参数，則返回被選元素的當前内容。
* val()
- 取值时，僅會返回第一個匹配元素的值。
- 但設值時，會設置所有匹配元素的值。
* Reference
- W3C jQuery 教程
沒有留言:
張貼留言