jQuery 第一課

前端開發入門線上課程訂閱

隨著前端技術在商業系統服務的開發過程中,扮演舉足輕重的角色,JavaScript 成為大量開發人員重度使用的程式語言,而 jQuery 函式庫則為 JavaScript 提供了快速開發的捷徑,寫得更少,作得更多(write less,do more),導入 jQuery 便能夠用極少的程式碼達到大量 JavaScript 才能作到的相同功能,當開發人員有了足夠的前端基礎,如果想要快速製作某些功能或是效果,可以考慮使用 jQuery。

jQuery 是一套函式庫,使用相當簡單,只要下載檔案將其配置於專案中進行引用即可。進入 jQuery 網站,切換至 Download 頁面。



頁面下方的 jQuery 區域中,按一下「Download the compressed, production jQuery x.x.x」,可以取得最新版的 jQuery 函式庫檔案 jquery-x.x.x.min。有了檔案就可以開始運用jQuery在網頁的開發中。

以下的影片進行簡單的示範。



jQuery 基本上以 $ 進行識別,透過 CSS 選擇器執行元素的存取,並將 JavaScript 各種功能封裝為可呼叫的單一方法,以簡化 JavaScript 的撰寫。

除了下載jQuery 檔案,也可以直接透過 CDN 來取得 jQuery 的支援,以下是Google提供的CDN位址。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

以這行取代原來的 script 配置,當網頁載入之後,就會直接到其指定位址取得所需的jQuery 檔案,效果完全相同,除了Google,其它如 Microsoft 亦提供相同的服務,列舉如下,請根據自己的需求進行設定即可。


寫得更少,作得更多(write less,do more), jQuery 重新改寫了 JavaScript 的開發模式,在你具備足夠的 JavaScript 技能之後,導入 jQuery 將有助於你大幅提升應用程式的開發效率。

3 則留言:

陳傳興 提到...

「在你具備足夠的 JavaScript 技能之後,導入 jQuery 將有助於你大幅提升應用程式的開發效率。」

這才是重點,現在很多人是反路,以為有了會了 jQuery 就是 JavaScript 的全部了,這是很危險的事。

陳傳興 提到...

走反路。

康廷數位文教網 提到...

這現象是有的

jQuery 太好用了,好用到一用就上癮,但是 JavaScript 才是真正的根,學好這東西才是最重要的,有了好的基礎,用起 jQuery 就很快了

沒練好 JavaScript 直接玩 jQuery ,就好比沒有內功只有兵器與招式,遇到困難就真的麻煩了 ...