JavaScript 架構庫 - jQuery
jQuery是JS的一個架構庫，他是把很多JS文法實作的功能進行了封裝，開發人員可以直接調用jQuery的方法。
如何使用：
要使用jQuery的某個庫，必須在<script></script>标簽中先引入該庫檔案(該庫檔案在jquery官網下載下傳)，例如：
或者：
1
2
3
4
5
6
7
8
9
10
11
12
13
<code><!DOCTYPE html></code>
<code><html lang</code><code>=</code><code>"zh-CN"</code><code>></code>
<code><head></code>
<code> </code><code><meta charset</code><code>=</code><code>"utf-8"</code><code>></code>
<code> </code>
<code> </code><code><title><</code><code>/</code><code>title></code>
<code><</code><code>/</code><code>head></code>
<code><body></code>
<code> </code>
<code><</code><code>/</code><code>body></code>
<code><script src</code><code>=</code><code>"/static/inspinia/js/jquery-2.1.1.js"</code><code>><</code><code>/</code><code>script></code>
<code><script src</code><code>=</code><code>"/static/inspinia/js/bootstrap.min.js"</code><code>><</code><code>/</code><code>script></code>
<code><script src</code><code>=</code><code>"/static/inspinia/js/plugins/metisMenu/jquery.metisMenu.js"</code><code>><</code><code>/</code><code>script></code>
jQuery能實作什麼功能？
我們可以通過使用 jQuery 應用 JavaScript 效果。
jQuery 是一個“寫的更少，但做的更多”的輕量級 JavaScript 庫。
基本上，你将學習到如何選取 HTML 元素，以及如何對它們執行類似隐藏、移動以及操作其内容等任務
以下是jQuery的所有方法，
<a href="http://www.php100.com/manual/jquery/" target="_blank">http://www.php100.com/manual/jquery/</a>
執行個體：
14
15
16
17
18
19
20
21
<code><</code><code>html</code> <code>lang</code><code>=</code><code>"zh-cn"</code><code>></code>
<code><</code><code>head</code><code>></code>
<code><</code><code>meta</code> <code>charset</code><code>=</code><code>"utf-8"</code><code>></code>
<code><</code><code>title</code><code>></</code><code>title</code><code>></code>
<code></</code><code>head</code><code>></code>
<code><</code><code>body</code><code>><</code><code>p</code><code>>I want to say:</</code><code>p</code><code>></code>
<code><</code><code>input</code> <code>type</code><code>=</code><code>"button"</code> <code>id</code><code>=</code><code>'addId'</code> <code>value</code><code>=</code><code>"追加"</code><code>></code>
<code></</code><code>body</code><code>></code>
<code><</code><code>script</code> <code>src</code><code>=</code><code>"js/jquery-3.1.1.js"</code><code>></</code><code>script</code><code>></code>
<code><</code><code>script</code> <code>src</code><code>=</code><code>"js/jquery-3.1.1.min.js"</code><code>></</code><code>script</code><code>></code>
<code><</code><code>script</code> <code>type</code><code>=</code><code>"text/javascript"</code><code>></code>
<code> </code><code>$(function(){</code>
<code> </code><code>$('#addId').click(function(){</code>
<code> </code><code>$('p').append('alex');</code>
<code> </code><code>});</code>
<code> </code><code>})</code>
<code></</code><code>script</code><code>></code>
<code></</code><code>html</code><code>></code>
<code>$(function(){</code>
<code> </code><code>Foo();</code>
<code> </code><code>Bar();</code>
<code>})</code>
表示web頁面一加載完後就會執行Foo( )和Bar( )函數。
上面的例子，我們給ID=addId的标簽綁定了一個事件（click事件），當點選“追加”按鈕時，會在所有<p>标簽的文本後面加上“alex”字元串。
測試：
打開頁面時
<a href="https://s4.51cto.com/wyfs02/M02/8E/BD/wKioL1jKUXPy43xyAAAYIRYRJTU485.png" target="_blank"></a>
點選追加按鈕後：
<a href="https://s4.51cto.com/wyfs02/M01/8E/BF/wKiom1jKUXTg6RT_AAAapux_tMU274.png" target="_blank"></a>
本文轉自 曾哥最愛 51CTO部落格，原文連結：http://blog.51cto.com/zengestudy/1907286，如需轉載請自行聯系原作者
![主流浏覽器四大綜合性能測試[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)