jQuery 基本語法、熱門插件

張凱喬

6 min readFeb 1, 2018

jQuery是一個新形態的JavaScript程式庫，主要是用在DOM 文件的操作，此外jQuery 的核心程式還加強了非同步傳輸(AJAX)以及事件(Event)的功能，讓你更容易操作遠端文件及事件。

jQuery可以幫助程式設計師更快的使用以javascript建立的模組，簡單來說，就是把javascript包裝成更白話、更迅速的寫法，此外，jQuery另外一個特色則是豐富的套件，五分鐘內就可以搞定燈箱、網頁進場效果。

基本語法資源

實用基礎篇 ⬇

jQuery 教學 - 基礎篇 - JavaScript 教學、心得分享 - jsGears.com 技術論壇 - AJAX, JavaScript, jQuery, 網站開發, 前端效能優化

前言]jQuery 是一套 JavaScript 的 Library，因此，你必須稍具 JavaScript 的基礎，至少寫過一些 JavaScript 才比較容易上手，並且看得懂後續的教學。jQuery ...

jsgears.com

完整的函式庫 ⬇

jQuery 教程

在本教程中，您将通过教程以及许多在线实例，学到如何通过使用 jQuery 应用 JavaScript 效果。

www.w3school.com.cn

(比較簡單的庫) ⬇

jQuery 屬性與樣式 (Attribute and CSS) - jQuery 教學 Tutorial

我想一般對於 JavaScript 大部分的操作都用在變動 HTML DOM 元素的屬性跟樣式，如果你有這個經驗，就會知道在設定時會有許多複雜及麻煩的問題，比如說舊 IE 它 setAttribute 不吃 name 屬性；又像在指定…

www.fooish.com

常用函式 ⬇

jQuery教學 - 常用函式 @ 小殘的程式光廊 :: 痞客邦 PIXNET ::

1. 核心(Core) 1.1 $(something) 依據參數產生或取得jQuery物件 $(selector) 依據selector規則取得Elements，例如 $('#my-ele

emn178.pixnet.net

幾個實戰教學⬇

PJCHENder那些沒告訴你的小細節

【精選APP X 網頁設計 X 使用者經驗 X 行銷 X 資料科學】分享的內容都是我覺得相當實用的資訊！

pjchender.blogspot.tw

語法的部分...好像也沒甚麼好介紹的
因為其實大致看過之後，就可以操作了

基本上，jQuery語法只要了解怎麼選取、怎麼動作就可以了
更重要的是學習如何在jQuery插件中調整客製的需求

2017熱門插件

50 Most Useful jQuery Plugins for Frontend Development

There many other JavaScript frameworks available, but jQuery is clearly the most popular (according to BuiltWith, it's…

speckyboy.com

19 brilliant jQuery plugins

jQuery has made web design faster, easier and more accessible. We reveal the best jQuery plugins to save you time and…

www.creativebloq.com

30 Best Free jQuery Plugins 2017

As jQuery plugins and its use on modern day websites increase we have decided to add some plugins or say code snippets…

dcrazed.com

隨機篩了幾個近期討論最棒插件的文章

挑幾個我覺得厲害的出來簡介

Tilted page scroll
往下滑動照片的時候可以有3D的特效
SVGMagic
讓你可以在網頁中使用svg向量圖
Owl Carousel
最簡單達成圖片輪播的插件
fullPage
整頁下滑的插件，建立整頁瀏覽的效果
multiScroll
整夜瀏覽只是滑動效果更炫
Splitchar
字體特效
BootstrapValidator、form validation jQuery plugin
搭配form建立驗證機制
prettySocial
實用! 直接建立社群分享button

那jQuery這麼厲害
有甚麼缺點嗎?

(Now More Than Ever) You Might Not Need jQuery | CSS-Tricks

The DOM and native browser API's have improved by leaps and bounds since jQuery's release all the way back in 2006…

css-tricks.com

CSS-tricks直接指出
JavaScript已經夠方便、越來越方便了
有些時候你用jQuery也只是多此一舉

jQuery considered harmful

Heh, I always wanted to do one of those "X considered harmful" posts*. 😀 Before I start, let me say that I think…

lea.verou.me

再來，資深的程式設計師都會建議
盡可能的不要使用jQuery

因為在寫jQuery的過程中很常混用jQuery本身的物件、原始的JavaScipt寫法與DOM元件，除了使程式碼越來越難理解之外，也捨棄了原先程式碼架構的意義。

Why do many web developers hate jQuery? - Hashnode

Answer (1 out of 11): When jQuery was the new thing, people loved it. It made cross-browser JS so much easier, it…

hashnode.com

受手持裝置瀏覽網頁的占比快速的拉升，大大的一包jQuery也會拖慢網頁瀏覽的速度，其中重要的關鍵因素是，jQuery擁有龐大的插件群支持，為了要配合及相容插件，所以jQuery也被迫繼續包著一大包。

這個有空可以再看一下像是Angular, React這些比較新的函示庫，這些新的函示庫沒有插件群的牽絆，可以快速地配合最新的JS api針對手持裝置的瀏覽體驗進行改善。

這篇先降
ㄅㄅ