內容簡介
本書以問題描述+解決方案的模式介紹jQuery技術,列舉瞭四百餘個實用性極強的Web前端開發技術,旨在幫助廣大讀者快速解決實際開發過程中麵臨的諸多問題,提高項目開發效率、拓展技術應用領域。本書內容按照Web前端常用的界麵元素進行劃分,如塊、單選按鈕、復選框、下拉框、文本框、選項卡、錶格、菜單、圖片、動畫特效、超鏈接、窗口及消息框等; 以簡單明瞭的jQuery代碼創建瞭現代商務網站中高頻齣現的特效,如摺疊麵闆、懸浮窗口、側滑窗口、轉盤抽奬、輪播廣告、對聯廣告、地圖熱點、在綫影院訂票、瀑布流顯示圖片、購物車以及插件擴展應用等。同時本書也在數據管理部分中列舉瞭大量的使用jQuery操作JSON、XML格式的數據和jQuery的多種遍曆迭代函數,以及正則錶達式和Ajax的相關技術。
為瞭突齣實用性和簡潔性,本書在演示或描述這些實例時,力求針對性地解決問題,並且所有實例均配有插圖。本書適於作為Web前端開發人員的案頭參考書,無論是初學者,還是編程高手,本書都極具參考和收藏價值。
目錄
第1章 基礎實例
001以淡入淡齣的效果顯示或隱藏元素
002以捲簾效果展開或收縮被選擇的元素
003根據可見狀態確定是否顯示或隱藏元素
004根據狀態確定是否滑入或滑齣被選元素
005自動確定是否淡入淡齣地顯示或隱藏元素
006在指定的時間內完成元素的顯示或隱藏
007查找並顯示在頁麵中被隱藏的元素
008以動畫效果改變塊內多個元素的不同屬性
009使用分組選擇器操作不同元素的相同屬性
010判斷指定的元素是否嵌套在父元素裏麵
011獲取指定元素在同類元素中的索引位置
012將指定的事件和方法綁定到指定的元素
013將多個事件和方法同時綁定到指定元素
014為元素同時綁定多個事件及其響應方法
015為同類元素添加相同的事件響應方法
016為匹配元素的事件綁定一次性響應方法
017為動態生成的元素綁定其事件響應方法
018處理在容器中的指定元素事件是否冒泡
019為document綁定或解綁相關鼠標事件
020創建刪除動態生成的元素及自身的按鈕
021設置元素屬性創建隻能單擊一次的按鈕
022在指定元素的後麵補充相同類型的內容
023在被選元素的開始位置插入指定的內容
024在被選元素的前邊插入新的HTML標記
025在被選元素的末尾添加新的HTML標記
026清除元素的HTML標記同時保留元素內容
027判斷某個指定ID的HTML標記是否存在
028獲取outerHTML整個節點的HTML內容
029修改無序列錶ul的首項末項及其指定項
030根據指定條件刪除無序列錶ul的節點
031在相同結構的無序列錶ul之間移動節點
032獲取在無序列錶ul中任意位置的li元素
033獲取無序列錶ul指定位置的節點內容
034獲取和設置在無序列錶ul中的節點樣式
035根據父元素篩選並設置無序列錶ul的節點
036在樹結構中查找離當前節點最近的父節點
037判斷鼠標是否單擊瞭無序列錶ul的節點
038獲取在無序列錶ul中的li元素的個數
039在無序列錶ul中篩選有子級的li元素
040篩選無序列錶ul的奇數或偶數行的li元素
041篩選無序列錶ul的某行之前或之後的li元素
042在無序列錶ul中實現根據內容篩選li元素
043在無序列錶ul中倒序查找符閤條件的li元素
044選擇無序列錶ul某個li元素之前(後)的元素
045選擇無序列錶ul指定範圍內的多個li元素
046根據輸入字符智能匹配符閤要求的li元素
047在無序列錶ul中每隔3行設置li元素的背景色
048為指定的元素添加或移除指定的CSS樣式
049在兩種不同風格的CSS樣式之間自動切換
第2章 塊實例
050使用文檔操作方法動態插入一個DIV塊
051為動態新增DIV塊添加click事件響應方法
052使用新DIV塊替換舊DIV塊內的多個元素
053在一個DIV塊之前插入另一個DIV塊
054動態隱藏DIV塊並帶有動畫緩衝效果
055動態顯示或隱藏在DIV塊中包含的內容
056在DIV塊中以Ajax方式加載HTML文件
057獲取用戶在DIV塊中的鼠標單擊坐標值
058檢測用戶在DIV塊上執行的鼠標單擊操作
059拖動分隔條改變左右兩個DIV塊的範圍
060拖動分隔條改變上下兩個DIV塊的範圍
061實現左右兩個不同DIV塊高度自動匹配
第3章 單選按鈕實例
062根據值設置單選按鈕radio的默認選項
063判斷單選按鈕radio的某選項是否被選中
064獲取用戶在單選按鈕radio組中的選擇結果
065獲取兩組或多組單選按鈕radio的選擇結果
066通過圖片自定義單選按鈕radio的圓點符號
067通過圖片實現單選按鈕radio的勾選特效
第4章 復選框實例
068設置指定復選框checkbox的選中狀態
069判斷指定復選框checkbox的選中狀態
070獲取已選擇的所有復選框checkbox
071獲取未選擇的所有復選框checkbox
072反選已選復選框checkbox之外的選項
073全選或全不選所有的復選框checkbox
074限製隻能選有限個數的復選框checkbox
075選擇復選框checkbox的偶數項或奇數項
076取消或選中復選框checkbox的相鄰選項
077同步全選或多選復選框checkbox的狀態
078使用圖片自定義復選框checkbox的勾選
第5章 下拉框實例
079根據值設置select下拉框的默認選項
080根據索引設置select下拉框的默認選項
081根據文本設置select下拉框的默認選項
082獲取select下拉框的已選中選項值
083獲取select下拉框的已選中選項索引
084獲取select下拉框的已選中選項文本
085獲取select下拉框的選項最大索引
086獲取select下拉框的選項個數
087在select下拉框中增加和刪除選項
088在select下拉框中插入新的選項
089在select下拉框中追加和清空選項
090取消選擇select下拉框的任何選項
091禁止選擇select下拉框的某個選項
092在select下拉框中滾動顯示選項
093自定義select下拉框的選項單擊事件
094在select下拉框中選擇多個選項
095逐行下移或上移select下拉框的選項
096在兩個select下拉框之間互相移動選項
097對select下拉框的選項進行分級分組
098頁麵控件跟隨select下拉框的值而改變
099單擊select下拉框選項則跳轉到目標頁
100實現級聯select下拉框選項的聯動響應
101實現父子select下拉框選項的聯動響應
102使用觸發器觸動兩級select下拉框聯動
103實現三級select下拉框的順次聯動響應
104使用無序列錶模仿select下拉框的功能
105使用無序列錶和文本框模仿select下拉框
106創建允許用戶輸入數據的select下拉框
107通過新窗口為select下拉框增加新選項
108直接使用數組為select下拉框添加選項
109使用二維數組為select下拉框添加選項
110從JSON文件中加載select下拉框選項
第6章 文本框實例
111獲取和設置用戶在文本框輸入的內容
112限製用戶必須在文本框中輸入數字
113在文本框中隻能輸入浮點數或自然數
114限製在文本框中隻能輸入數字字母
115禁止在文本框中輸入特殊字符或空格
116限製在文本框中能夠輸入的最多字符
117統計在文本框中可輸入的剩餘字符數
118自動閃爍用戶在文本框中的輸入內容
119在文本框獲得焦點時高亮顯示其內容
120在驗證時實現抖動不符閤要求的文本框
121監控文本框在一段時間是否有輸入內容
122在超過文本框限製字符數時禁用提交按鈕
123在文本框中實現放大縮小以及上下滾動
124在文本框右邊懸浮一個內容輸入提示框
125在文本框中輸入郵箱時顯示輸入列錶
126在空文本框失去焦點時恢復默認值
127在空文本框失去焦點時填補默認值
128在文本框為空白狀態時顯示提示信息
129在文本框的內部設置缺省提示信息
130比較簡略地在文本框中設置提示信息
131在textarea文本域的光標處插入文本
132獲取多個文本框的ID標識和輸入內容
133在多個文本框間通過迴車鍵切換焦點
134將文本框的輸入內容轉換成二維碼
第7章 選項卡實例
135創建可淡入淡齣切換內容的選項卡
136創建以捲簾下拉式滑動的選項卡
137僅使用DIV塊創建縱嚮風格的選項卡
138使用無序列錶和DIV塊創建水平選項卡
139創建嵌套型導航菜單風格的選項卡
140創建與滑動菜單風格類似的選項卡
141創建類似MSN中文網的滑動選項卡
142創建自動輪播顯示的垂直選項卡
143創建自動輪播顯示的水平選項卡
144創建自動輪播顯示的滑動選項卡
145創建按照流程順序執行的選項卡
146創建城市名按拼音索引的選項卡
147創建類似於單選按鈕風格的選項卡
148創建類似於圖文結閤按鈕的選項卡
第8章 錶格實例
149獲取和設置錶格table的單元格文本內容
150獲取和設置錶格table的單元格HTML內容
151獲取在錶格table中鼠標單擊的單元格內容
152獲取錶格table指定列的所有單元格內容
153獲取錶格table指定列和行的單元格內容
154設置錶格table首行和首列的背景顔色
155以隔行錯色的效果顯示錶格table的數據
156在錶格table中實現鼠標單行選擇效果
157當鼠標在錶格table上移動時選擇整行
158高亮顯示錶格table的鼠標所在當前行
159高亮顯示錶格table的鼠標所在移動行
160使用多色不斷閃爍錶格table的邊框綫
161以嵌套方式動態生成多行多列錶格table
162隱藏在錶格table中的指定行和指定列
163根據條件隱藏或顯示錶格table的部分行
164在錶格table中實現逐行上移或逐行下移
165將指定行的內容移到錶格table的頂部
166在錶格table中動態插入行或刪除行
167在錶格table中動態增加列和刪除列
168在錶格table的每行設置增加和刪除按鈕
169在錶格table中使用剋隆的對象新增數據
170清空錶格table除標題欄外的所有內容
171把錶格table的所有數字轉換成百分數
172使用新建元素替換錶格table的被選元素
173互換在錶格table中的輸入框和文本標簽
174在錶格table中閤並相同內容的單元格
175允許編輯在錶格table中的任意單元格
176在錶格table的末尾實現自動增加空白行
177篩選在錶格table中符閤指定條件的內容
178篩選JSON數據源並顯示在錶格table中
179篩選XML文件內容並顯示在錶格table中
180單擊列頭排列在錶格table中的該列數據
181以分組形式展開和摺疊錶格table的內容
182在懸浮框中放大顯示在錶格table中的圖片
第9章 菜單實例
183一行代碼實現的無限摺疊或展開菜單
184創建自動摺疊和展開的垂直導航菜單
185以鏈式方式創建的摺疊垂直導航菜單
186以手風琴方式展開摺疊的垂直導航菜單
187創建可收縮展開的多級垂直導航菜單
188創建捲簾式展開摺疊的垂直導航菜單
189創建以捲簾風格縮放的垂直導航菜單
190創建圖片和文字結閤的垂直導航菜單
191創建子菜單橫嚮滑齣的垂直導航菜單
192創建子菜單圖文結閤的垂直導航菜單
193創建帶指示符號的三級垂直導航菜單
194創建類似於bar滑動的水平導航菜單
195創建鼠標懸停背景翻轉的水平導航菜單
196創建水平滑動的異形背景的導航菜單
197創建水平方嚮滑動的二級橫嚮導航菜單
198實現背景色綫性漸變的水平導航菜單
199高仿電商平颱的摺疊展開的水平導航菜單
200在hover事件中實現的水平下拉式菜單
201在hover事件中控製的水平下拉式菜單
202在mouseover事件中控製的下拉式菜單
203創建高亮顯示的二級橫嚮導航菜單
204創建橫嚮和縱嚮都有動畫的下拉菜單
205創建有或無次級菜單結閤的導航菜單
206創建類似於下拉窗簾的動態滑動菜單
207創建以翻滾方式切換的中英文菜單
208創建動感豐富的滑齣圖片的導航菜單
209創建動感豐富的滑齣文字的導航菜單
210實現類似於select下拉框的下拉式菜單
211創建小圖和大圖聯動的圖片導航菜單
212創建主菜單在圓心且子菜單在圓周的菜單
213高仿京東首頁的橫嚮展開的二級菜單
214高仿蘋果底部任務欄圖形大小漸變菜單
215在圖片上創建自定義的右鍵上下文菜單
216創建不隨滾動條改變的懸浮導航菜單
217單擊懸浮菜單滾動到指定的元素位置
218實現導航菜單的當前項跟隨鼠標飄移
219在鼠標單擊最右邊時浮動菜單自動左移
220為側邊導航菜單創建氣泡式的提示窗口
221禁止在右鍵單擊頁麵時彈齣的默認菜單
222實現從JSON中將數據加載到二級菜單
第10章 圖片實例
223在鼠標放在圖片上時上下震動圖片
224在鼠標放在圖片上時左右擺動圖片
225使用圖片模擬QQ聊天窗口的抖動特效
226在使用鼠標單擊圖片時左右晃動圖片
227在鼠標指嚮圖片時浮齣半透明的窗口
228在鼠標懸停圖片時浮齣半透明的窗口
229在鼠標懸停圖片時滑齣半透明的窗口
230在鼠標放在圖片上時滑齣隱藏的窗口
231在鼠標放在圖片上時滑齣上下遮罩層
232為圖片添加從下嚮上滑齣的遮罩層
233在鼠標放在標題上時滑齣對應的圖片
234當鼠標放在小圖上時即顯示對應的大圖
235高亮顯示鼠標選擇的圖片並使周圍變暗
236放大或縮小選擇的圖片並重置關聯樣式
237通過滑動鼠標的滾輪來放大或縮小圖片
238在圖片收縮和擴展時相關文字動態跟隨
239局部放大用戶在小圖片中選擇的部分
240創建從右上角嚮左下角拉齣圖片的效果
241從左至右展開圖片和從右至左摺疊圖片
242以動畫方式摺疊圖片並改變透明度
243確保懸浮圖片一直在用戶的可視範圍內
244控製懸浮的廣告圖片是否隱藏或顯示
245拖動range控製圖片按照一定角度傾斜
246使用鼠標把圖片拖曳到頁麵的任意位置
247在可任意拖曳的圖片上添加關閉功能
248在圖片周圍添加類似走馬燈的虛綫框
249以瀑布流方式顯示已加載的多張圖片
250在滾動頁麵時以瀑布流方式加載圖片
251使用鼠標單擊小圖片則彈齣對應大圖片
252使用鼠標單擊縮略圖則播放對應視頻
253左右滑動鼠標來切換顯示兩張圖片
254以單張方式滾動顯示在圖庫中的圖片
255以成組方式滾動顯示在圖庫中的圖片
256以連續滾動方式顯示在圖庫中的圖片
257以無縫連續滾動方式顯示圖庫中的圖片
258以上一張下一張的方式顯示多張圖片
259成組的多張圖片以手風琴方式滑動切換
260實現大圖和小圖的自動輪播或指定顯示
261從上到下循環顯示在無序列錶ul中的圖片
262高亮滾動切換圖片和文字混閤的模塊
263輕量級無插件的廣告圖片輪播切換
264輕量級無插件的廣告圖片輪播顯示
265輕量級無插件的廣告圖片切換顯示
266輕量級無插件的圖片定時輪播顯示
267大圖片和縮略圖片同時實現自動輪播
268通過有序和無序列錶控製圖片輪播
269懸浮前後導航按鈕的廣告圖片輪播
270同時實現自動輪播和縱嚮導航的圖片顯示
271分組批量顯示包含圖片和文字的組閤體
272實現選中的商品圖片以拋物綫飛入購物車
273創建適閤書架階梯展示的圖片縮放特效
274在隨機排列圖片時顯示圖片的移動軌跡
275在執行操作圖片前確保圖片加載完成
276根據圖片地址獲取圖片的高度和寬度
277在單擊圖片時自動切換到下一張圖片
278檢測鍵盤按鍵輸入來更換顯示的圖片
279強製圖片等元素位於頁麵的中心位置
280在每隔一段時間後改變網頁背景圖片
281以不同方式設置頁麵的背景圖片樣式
282通過插件實現小圖和大圖聯動的畫廊
第11章 動畫實例
283以動畫效果從當前位置返迴到指定位置
284在返迴頁麵頂部或底部時實現動畫效果
285實現類似點贊飛齣數字 1的動畫效果
286實現類似點贊的隨機數字顯示動畫效果
287實現星級評分控件動態顯示等級及分數
288實現類似於撲剋牌洗牌特效的翻頁相冊
289實現新聞標題的逐條漸隱漸顯滾動顯示
290實現新聞標題的逐行(屏)自動滾動顯示
291實現圖文標題的逐條循環自動滾動顯示
292通過層疊實現3D樣式的文字動畫效果
293實現類似於進度條的動態投票柱狀效果圖
294創建與頁麵加載類似的簡易動畫進度條
295高仿360係統安全體檢風格的動畫進度條
296使用gDialog插件製作超酷動畫對話框
297通過迴調函數實現多個動畫的不間斷執行
298在多個動畫隊列中啓動動畫或停止動畫
299實現在隊列中的任務按指定時間延遲執行
300以鏈式方式完成在動畫隊列中的多個動畫
第12章 特效實例
301創建百分比和圖形變化聯動的進度條
302創建可暫停的數字和圖形聯動的進度條
303在同一按鈕上滾動實現多個按鈕的功能
304使用數學函數實現超炫超酷的鼠標軌跡
305創建不隨頁麵滾動的懸浮對聯廣告特效
306高仿百度貼吧頂部不隨滾動條滾動的特效
307實現類似於九宮格大轉盤的隨機抽奬
308使用插件高仿中心鏇轉指針的抽奬轉盤
309創建像飄浮的雲一樣的隨機中奬特效
310使用插件實現在輸入框中彈齣列錶樹
311實現動態顯示圖像和文字結閤的星級評分
312高仿城市地鐵綫路指示燈的到站提示特效
313高仿電商平颱的切換全部和部分品牌特效
314實現類似於打字員打字的逐字輸入效果
315通過2D轉換創建連續鏇轉縮放的文字塊
316創建從中心嚮左右展開的動感立體文字特效
317在鼠標滑過文章或新聞列錶時突齣顯示條目
318實現多行公告文字從下到上逐行滾動顯示
319實現圖文標題淡入淡齣地逐條循環顯示
320實現新聞標題按照分組從上到下循環顯示
321實現單行公告信息文字從右到左滾動顯示
322使用DIV塊創建循環顯示的跑馬燈文字特效
323通過marquee創建跑馬燈文字的
jQuery炫酷應用實例集錦 epub pdf mobi txt 電子書 下載 2024
jQuery炫酷應用實例集錦 下載 epub mobi pdf txt 電子書