JQuery每日一練

Tips

實踐是檢驗真理的惟一標準

1.練習一

1.1 練習網站導航相關

jquery01.gif

考察重點

• hover事件
• show(); hide() 方法
• index(); eq(); 方法
• addClass(); removeClass() 方法
• siblings() 方法
• 鏈式調用

頁面除去js均已列出，請在10分鐘內有思路，一小時內完後，可參考百度。
點擊查看頁面 不要F12偷看
點擊下載無js的頁面 記得修改後綴

2.練習二

2.1 省市區三級聯動

任務目標：實現省市區級聯及選中地區時將省市區編碼和名稱拼接展現
用於何處：通常用於級聯或聯動操做

jquery-02.gif

考察重點

• html() 方法
• change事件
• ajax 方法
• empty() 方法
• append() 方法
• (".province").find("option:selected").text() 獲取下拉選中的option的文本值
• 接口文檔學習查看

接口地址

http://b2b.haier.com/shop/api/process/app/getAreaInfo

請求方法

POST

參數

參數	註釋	是否必填	備註
areaId	地區id	否	地區id(查詞地區下子集),若不填則查詢所有省份

點擊查看頁面 不要F12偷看
點擊下載無js的頁面 記得修改後綴

3.練習三

3.1 checkbox詳細用法

任務目標：實現表格行的增長刪除，及checkbox詳細用法
用於何處：通常用於表格的變動，如報表處理的複雜操做

3.gif

考察重點

• is() 方法 - 如(".allCheck").on("change",fn) checkbox切換事件
• prop() - ("tr").remove(); 刪除目標元素*

ES6知識點

• 模板字符串``

點擊查看頁面 不要F12偷看
點擊下載無js的頁面 記得修改後綴

4.練習四

4.1 鍵盤事件監聽用法

任務目標：實現貪吃蛇的基本簡單事件
用於何處：通常用於js小遊戲，或須要監聽鍵盤事件的頁面

4.gif

考察重點

• keydown()方法 -- 如$(document).keydown(fn) 監聽鍵盤按下事件
• event.keyCode -- 鍵盤事件所對應觸發的鍵值 如左箭頭 37
• css() --設置目標元素的css樣式
• parseInt() -- 取整數
• switch case -- 語句判斷

點擊查看頁面 不要F12偷看
點擊下載無js的頁面 記得修改後綴