第一章鏈接：初識JavaScript - 章節(jié)課后練習(xí)題及答案
第二章鏈接：JavaScript 基礎(chǔ)（上） - 章節(jié)課后練習(xí)題及答案?
第三章鏈接：JavaScript 基礎(chǔ)（下） - 章節(jié)課后練習(xí)題及答案
第四章鏈接：JavaScript 函數(shù) - 章節(jié)課后練習(xí)題及答案
第五章鏈接：JavaScript 對象 - 章節(jié)課后練習(xí)題及答案
第六章鏈接：DOM（上） - 章節(jié)課后練習(xí)題及答案
第七章鏈接：DOM（下） - 章節(jié)課后練習(xí)題及答案
第八章鏈接：BOM - 章節(jié)課后練習(xí)題及答案?
第九章鏈接：JavaScript網(wǎng)頁特效 - 章節(jié)課后練習(xí)題及答案
注：使用的是人民郵電出版社出版的《JavaScript+jQuery 交互式 Web 前端開發(fā)》書籍。
?一、填空題
? ? ? ? 1、在篩選選擇器中，通過______方法獲取第一個li元素。?
? ? ? ? 2、jQuery動畫中，通過______方法用來控制元素的淡入顯示。
? ? ? ? 3、在篩選選擇器中，通過______方法獲取最后一個li元素。
? ? ? ? 4、jQuery動畫中，通過______方法顯示被隱藏的匹配元素。
? ? ? ? 5、jQuery操作類名的方法中，通過______方法向被選元素添加一個或多個類名。
二、判斷題
? ? ? ? 1、jQuery是一個快速、簡潔的JavaScript庫，其設(shè)計宗旨是“write less，do more”。（ ）
? ? ? ? 2、jQuery文件的類型主要包括未壓縮（uncompressed）的開發(fā)版和壓縮（minified）后的生產(chǎn)版。（ ）
? ? ? ? 3、將jQuery引入后，在全局作用域下會新增“$”和“jQuery”兩個全局變量。（ ）
? ? ? ? 4、?$("div")可以獲取div元素，這種方式就是通過jQuery選擇器來獲取元素。（ ）
? ? ? ? 5、用id選擇器獲取指定id的元素，語法表示為$(".id")。（ ）
三、選擇題
????????1、下列選項中，通過標(biāo)簽名獲取元素的是（ ）。
????????????????A. $("#id")????????B. $(".class")????????C. $("div")????????D. $("*")?
? ? ? ? 2、下列篩選選擇器中，獲取li元素，并選擇索引為奇數(shù)的元素的是（ ）。
????????????????A. $("li:first")????????B. $("li:last")????????C. $("li:odd")????????D. $("li:even")
? ? ? ? 3、jQuery提供了用于停止動畫效果的方法是（ ）。
????????????????A. stop()????????B. fadeTo()????????C. animate()? ? ? ? D. show()
? ? ? ? 4、下面選項中，可以實現(xiàn)從被選元素移除一個或多個類的是（ ）。
????????????????A. removeClass()?? B. toggleClass()?? C. toggle()???? D. addClass()
? ? ? ? 5、下列關(guān)于jQuery的說法，錯誤的是（ ）。
????????????????A. jQuery是一個輕量級的腳本，其代碼非常小巧。
????????????????B. 不支持CSS 1~CSS 3定義的屬性和選擇器。
????????????????C. 實現(xiàn)了JavaScript腳本和HTML代碼的分離，便于后期編輯和維護
????????????????D. 插件豐富，可以通過插件擴展更多功能
四、簡答題
? ? ? ? 1、請列舉jQuery中基本選擇器有哪些。
? ? ? ? 2、請例舉操作元素類名的方法有哪些。
五、編程題
? ? ? ? 1、請使用jQuery設(shè)置頁面中的div元素的寬度為200px，高度200px。
? ? ? ? 2、請使用jQuery實現(xiàn)頁面中div元素向右運動100px后回到初始位置的動畫效果。
參考答案：
一、填空題
????????1、:first
? ? ? ? 2、fadeIn()
? ? ? ? 3、:last
? ? ? ? 4、show()
? ? ? ? 5、addClass()
二、判斷題
????????1、對 ?????? 2、對 ???? 3、對? ? ? ? 4、對????????5、錯
三、選擇題
????????1、C? ? ? ? ?2、C? ? ? ?3、A? ? ? ? ?4、A? ? ? ? ?5、B
四、簡答題
? ? ? ? 1、請列舉jQuery中基本選擇器有哪些。? ? ? ? ? ? ?
????????????????id選擇器：獲取指定id的元素，語法$("#id")。
?????????????????全選選擇器：匹配所有元素，語法$("*")。
????????????????類選擇器：獲取同一類class的元素，語法$(".class")。
????????????????標(biāo)簽選擇器：獲取相同標(biāo)簽名的所有元素，語法$("div")。
?????????????????并集選擇器：選取多個元素，語法$("div,p,li")。?
????????????????交集選擇器：交集元素，語法$("li.current")。?
? ? ? ? 2、請列舉操作元素類名的方法有哪些。
????????????????addClass()方法向被選元素添加一個或多個類名。
????????????????removeClass()方法從被選元素移除一個或多個類。
????????????????toggleClass()方法用來為元素添加或移除某個類，如果類不存在，就添加該類，如果類存在，就移除該類。
五、編程題
? ? ? ? 1、請使用jQuery設(shè)置頁面中的div元素的寬度為200px，高度200px。
//定義div元素： <div style="background-color:red"></div> //jQuery代碼如下： $('div').css({width:'200px',height:'200px'});????????完整代碼如下：
<html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> //引入jquery文件 <script src = "jquery-3.4.1.min.js"></script> </head> <body> <div style="background-color:red"></div> <script> $('div').css({width:'200px',height:'200px'}); </script> </body> </html>? ? ? ? 2、請使用jQuery實現(xiàn)頁面中div元素向右運動100px后回到初始位置的動畫效果。文章來源：http://www.zghlxwxcb.cn/news/detail-522212.html
//定義div元素: <button>向右移動</button> <div style="background-color:red; width:50px; height:50px; position:absolute;"> </div> //jQuery代碼如下： $("button").click(function () { $("div").animate({ left: 100, }, 500); }); $("button").click(function () { $("div").animate({ left: 0, }, 500); });?完整代碼如下：文章來源地址http://www.zghlxwxcb.cn/news/detail-522212.html
<html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> //注意引入jquery文件 <script src="jquery-3.4.1.min.js"></script> </head> <body> <button>向右移動</button> <div style="background-color:red;width:50px;height:50px;position:absolute;"></div> <script> $("button").click(function () { $("div").animate({ left: 100, }, 500); }); $("button").click(function () { $("div").animate({ left: 0, }, 500); }); </script> </body> </html>
到了這里，關(guān)于十、jQuery（上） - 章節(jié)課后練習(xí)題及答案的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
