一、Jquery測試題
下面哪種不是jquery的選擇器?(單選)
A、基本選擇器 B、后代選擇器 C、類選擇器 D、進一步選擇器
考點:jquery的選擇器 (C)
當DOM加載完成后要執行的函數,下面哪個是正確的?(單選)
jQuery(expression, [context]) B、jQuery(html,[ownerDocument]) C、jQuery(callback) D、jQuery(elements)
考點:jquery的核心函數 (C)
下面哪一個是用來追加到指定元素的末尾的?(單選)
A、insertAfter() B、append() C、appendTo() D、after()
考點:jquery的核心函數 (C)
下面哪一個不是jquery對象訪問的方法?(單選)
A、each(callback) B、size() C、index(subject) D、index()
考點: jquery的核心函數之對象訪問 (D)
jquery訪問對象中的size()方法的返回值和jQuery對象的_______屬性一樣.
考點:jquery的核心函數之對象訪問 (length)
jquery中$(this).get(0)的寫法和__________是等價的。
考點:jquery的核心函數之對象訪問 ($(this)[0])
7.有這樣一個表單元素
,想要找到這個hidden元素,下面哪個是正確的?(單選)
A、visible B、hidden C、visible() D、hidden()
考點:jquery的選擇器 (B)
如果需要匹配包含文本的元素,用下面哪種來實現?(單選)
A、text() B、contains() C、input() D、attr(name)
考點:jquery的選擇器 (B)
現有一個表格,如果想要匹配所有行數為偶數的,用________實現,奇數的用_______實現。
考點:jquery的選擇器 (even,odd)
如果想要找到一個表格的指定行數的元素,用下面哪個方法可以快速找到指定元素?(單選)
A、text() B、get() C、eq() D、contents()
考點:jquery的選擇器 (C)
在一個表單里,想要找到指定元素的第一個元素用_________實現,那么第二個元素用_________實現。
考點:jquery的選擇器 (first,eq(1))
下面哪種不屬於jquery的篩選?(單選)
A、過濾 B、自動 C、查找 D、串聯
考點:jquery的篩選 (B)
下面哪幾種是屬於jquery文檔處理的? (多選)
A、包裹 B、替換 C、刪除 D、內部和外部插入
考點:jquery的文檔處理 (ABD)
如果想在一個指定的元素后添加內容,下面哪個是實現該功能的?(單選)
A、append(content) B、appendTo(content)C、insertAfter(content) D、after(content)
考點:jquery的文檔處理 (D)
在jquery中,用一個表達式來檢查當前選擇的元素集合,使用______來實現,如果這個表達式失效,則返回___________值。
考點:jquery的篩選 (is(expr),false)
在jquey中,如果想要從DOM中刪除所有匹配的元素,下面哪一個是正確的?(單選)
A、delete() B、empty() C、remove() D、removeAll()
考點:jquery的文檔處理 (C)
在jquery中,想要給第一個指定的元素添加樣式,下面哪一個是正確的?(單選)
A、first B、eq(1) C、css(name) D、css(name,value)
考點: jquery的css處理 (C)
在編寫頁面的時候,如果想要獲取指定元素在當前窗口的相對偏移,用_________來實現,該方法的返回值有兩個屬性,分別是________和__________。
考點:jquery的css處理 (offset,top,left)
在jquery中,如果想要獲取當前窗口的寬度值,下面哪個是實現該功能的? (單選)
A、width() B、width(val) C、width D、innerWidth()
考點:jquery的css處理 (A)
在一個表單中,如果將所有的div元素都設置為綠色,實現功能是____________________________。
考點:jquery的css處理 ($(“div”).css(“color”,”green”))
為每一個指定元素的指定事件(像click)綁定一個事件處理器函數,下面哪個是用來實現該功能的? (單選)
A、trigger (type) B、bind(type) C、one(type) D、bind
考點:jquery的事件操作 (B)
在jquery中,鼠標移動到一個指定的元素上,會觸發指定的一個方法,實現該操作的是______________。
考點:jquery的事件操作(hover(over,out))
下面哪幾個不是屬於jquery的事件處理? (多選)
A、bind(type) B、click() C、change() D、one(type)
考點:jquery的事件處理 (BC)
在一個表單中,如果想要給輸入框添加一個輸入驗證,可以用下面的哪個事件實現? (單選)
A、hover(over ,out) B、keypress(fn) C、change() D、change(fn)
考點:jquery的事件處理 (D)
當一個文本框中的內容被選中時,想要執行指定的方法時,可以使用下面哪個事件來實現?(單選)
A、click(fn) B、change(fn) C、select(fn) D、bind(fn)
考點:jquery的事件處理 (C)
在jquery中,想讓一個元素隱藏,用________實現,顯示隱藏的元素用_________實現。
考點:jquery的頁面效果 (hide(),show())
在一個表單中,用600毫秒緩慢的將段落滑上,用__________________________________來實現。
考點:jquery的頁面效果 ($(“p”).slideUp(“slow”))
在jquery中,如果想要自定義一個動畫,用___________________________函數來實現。
考點:jquery的頁面效果 (animate(params,options))
在jquery中想要實現通過遠程http get請求載入信息功能的是下面的哪一下事件? (單選)
A、$.ajax() B、load(url) C、$.get(url) D、$. getScript(url)
考點:jquery的ajax (C)
下面不屬於ajax事件的是? (單選)
A、ajaxComplete(callback) B、ajaxSuccess(callback)C、$.post(url) D、ajaxSend(callback)
考點:jquery的ajax (C)
徹底將jQuery變量還原,可以使用___________________方法實現。
考點:jquery的多庫共存 ($.noConflict(extreme))
上機題:
用jquery 來實現動態添加和刪除表格行
在一個表單中,查找所有選中的input元素,可以用jquery中的____________________來實現。
考點:jquery的選擇器(:not())
下面哪幾種是jquery中表單的對象屬性?(多選)
A、:checked B、: enabled C、:hidden D、:selected E、:file F、: disabled
考點:jquery的選擇器(ABDF)
在jquery中如果將一個“名/值”形式的對象設置為所有指定元素的屬性,可以用________________實現。
考點:jquery選擇器之屬性 (attr(pro))
在jquery中指定一個類,如果存在就執行刪除功能,如果不存在就執行添加功能,下面哪一個是可以直接完成該功能的?(單選)
A、removeClass() B、deleteClass()C、toggleClass(class) D、addClass()
考點:jquery的屬性 (C)
在jquery中想要找到所有元素的同輩元素,下面哪一個是可以實現的?(單選)
A、eq(index) B、find(expr) C、siblings([expr]) D、next()
考點:jquery的篩選 (C)
二、css測試題
css的語法由___________、_____________、____________三部分組成。
考點:css的語法 (選擇器、屬性和值)
下面哪一個不是檢索一個對象的定位方式的屬性? (單選)
A、static B、absolute C、fixed D、top
考點:css的定位 (D)
下面哪個是display布局中用來設置對象以塊顯示,並添加新行的? (單選)
A、inline B、none C、block D、compact
考點:css的布局 (C)
設置邊框的邊框樣式用_____________實現,設置邊框的顏色用_________實現。
考點:css的邊框 (border-style,border-color)
設置一個div的最小寬度為100像素,最大高度為50像素,實現這兩個設置的方法是_______、________________。
考點:css的尺寸 (min-width:100px; min-height:50px;)
為一個圖片設置成背景圖像后,設置背景圖像在縱向和橫向上平鋪,下面哪個是實現該功能的? (單選)
A、no-repeat B、repeat C、repeat-x D、repeat-y
考點:css的背景background (repeat)
想要設置一個對象外的線條輪廓的樣式為虛線邊框,用_______________實現該功能。
考點:css的輪廓outline(outline-style: dashed)
在css中,如果想要阻止計數器增加的,用__________________來實現。
考點:css的內容content (counter-increment: none)
在編寫css樣式的時候,如果想要設置標記容器和主容器之間的補白,用_______________來表示。
考點:css的列表 (marker-offset)
如果想設置表格的行與單元格的邊框合並在一起,可以用___________________來實現。
考點:css的表格 (border-collapse:collapse)
如果想設置一個對象內文本的流動和方向,用_______________標簽來實現,該標簽有兩個值,分別是_____________、______________。
考點:css的文本Text (text-layout-flow,horizontal、vertical-ideographic)
在編寫css樣式的時候,如果想要設置文本的對齊方式,下面哪一個不是text-align下的值?(單選)
A、left B、right C、top D、justify
考點:css的文本 Text (C)
在css中,如果想要設置對象中文本的樣式,下面哪一個不是該標簽的值?(單選)
A、blink B、line-through C、color D、overline
考點:css的字體font (C)
在css中,設置滾動條的表面顏色,是用下面的哪個標簽來實現的?(單選)
A、scrollbar-base-color B、scrollbar-face-colorC、scrollbar-arrow-color
D、scrollbar-shadow-color
考點:css的滾動條scrollbar(B)
三、問答題
1. 什么是jQuery?
jQuery是繼prototype之后又一個優秀的Javascrīpt框架。
2. HTML代碼:
This is a DIV
1) 把這個HTML元素轉化為jQuery對象的語句是?
2) 得到div元素內文本的語句可以是哪些?
3) 把元素內文本設置為粗體的方法有?
4) 清空文本的方法有?
1.$(“div”)
2.$(“div”).text(),$(“div”).html ()
3.$(“div”).text(“This is DIV”)
4.$(“div”).text(“”)
3. HTML代碼:
窗體頂端
窗體底端
1) $(‘:hidden’).length的值是?
1
2) $(‘form input’), $(‘form > input’), $(‘form + input’), $(‘form ~ input’)分別返回代表哪些元素的jQuery數組?
$(‘form input’) 返回form下的所有input元素
$(‘form > input’) 查找以form為父元素所有input子元素
$(‘form + input’) 查找以form之外第一個input子元素
$(‘form ~ input’) 查找以form之外所有input子元素
3) 獲取form里第二個input元素的方法有?
$(“#div1 input”).eq(1)
4) $(‘form input:first’).parent()返回的是?
5) $(‘form input:first’).parents().size()的值是?
1
6) $(‘#div1’).empty()與$(‘#div1’).remove()的結果有什么不同?
$(‘#div1’).empty()清空 div1的內容 結果為
$(“#div1”).remove()刪除div1節點 及包含的子節點
4. 有一個button
執行以下jQuery語句:
$(‘#btn’).click(function(){ alert(‘click me’); });
$(‘#btn’).click(function(){ alert(‘click me again.’)});
單擊這個button會有什么效果?
彈出2次對話框 分別是 click me, click meagain
5. HTML代碼:
Hello how are you?
jQuery 代碼:
$("p").find("span").text(‘Hi’).end()
結果是?
Hihow are you
1 你在公司是怎么用jquery的?
答:在項目中是怎么用的是看看你有沒有項目經驗(根據自己的實際情況來回答) 你用過的選擇器啊,復選框啊,表單啊,ajax啊,事件等 配置Jquery環境 下載jquery類庫 在jsp頁面引用jquery類庫即可 <scripttype="text/javascript"src="jquery/jquery-1.7.2.min.js"/> 接下來通過在 <script> $(function(){ }); </script>
2你為什么要使用jquery?
答:因為jQuery是輕量級的框架,大小不到30kb,它有強大的選擇器, 出色的DOM操作的封裝,有可靠的事件處理機制(jQuery在處理事件綁定的時候相當的可靠), 完善的ajax(它的ajax封裝的非常的好,不需要考慮復雜瀏覽器的兼容性和XMLHttpRequest 對象的創建和使用的問題。) 出色的瀏覽器的兼容性。 而且支持鏈式操作,隱式迭代。 行為層和結構層的分離,還支持豐富的插件,jquery的文檔也非常的豐富。
3你覺得jquery有哪些好處? 答案同上
4 你使用jquery遇到過哪些問題,你是怎么解決的?
答:這個答案是開發的,看你是否有相關的項目經驗。 例 前台拿不到值,JSON 可是出現的錯誤(多了一個空格等)這編譯是不會報錯的 jquery庫與其他庫沖突: 1>如果其他庫在jquery庫之前導入的話 1.我們可以通過jquery.noconflict()將變量的$的控制權過度給其他庫 2.自定義快捷鍵,用一個變量接住jquery.noconflict() 3.通過函數傳參 2>如果jquery庫在其他庫之前導入就直接使用jquery 今天在處理一個數據問題時,發現jQuery.ajax()方法返回的值一直有問題,清除緩存后數據無誤, 多次測試后發現返回的值都是之前的值,並且一直未執行url(后台為JAVA,設置斷點一直未進入)。在網上查找下,發現是未設置type的原因。 如果沒設置jQuery.ajax的type="Post",那么ajax就會默認type="Get",這就會導致之前數據被緩存起來。加上type="Post",問題解決!
5 你知道jquery中的選擇器嗎,請講一下有哪些選擇器?
答 :jQuery中的選擇器大致分為:基本選擇器,層次選擇器,過濾選擇器,表單選擇器
6 jquery中的選擇器 和 css中的選擇器有區別嗎?
答:jQuery選擇器支持CSS里的選擇器, jQuery選擇器可用來添加樣式和添加相應的行為 CSS 中的選擇器是只能添加相應的樣式
7 你覺得jquery中的選擇器有什么優勢?
答:簡單的寫法 $('ID') 來代替document.getElementById()函數 支持CSS1 到CSS3選擇器 完善的處理機制(就算寫錯了id也不會報錯)
8 你在使用選擇器的時候有有沒有什么覺得要注意的地方?
答: 1 選擇器中含有".","#","[" 等特殊字符的時候需要進行轉譯 2 屬性選擇器的引號問題 3 選擇器中含有空格的注意事項
9 jquery對象和dom對象是怎樣轉換的?
答 :jquery轉DOM對象:jQuery 對象是一個數組對象,可以通過[index]的豐富得到相應的DOM對象 還可以通過get[index]去得到相應的DOM對象。 DOM對象轉jQuery對象:$(DOM對象)
10 你是如何使用jquery中的ajax的?
答: 如果是一些常規的ajax程序的話,使用load(),$.get(),$.post(),就可以搞定了, 一般我會使用的是$.post() 方法。 如果需要設定beforeSend(提交前回調函數),error(失敗后處理),success(成功后處理) 及complete(請求完成后處理)回調函數等,這個時候我會使用$.ajax()
11 你覺得jquery中的ajax好用嗎,為什么?
答: 好用的。 因為jQuery提供了一些日常開發中夙瑤的快捷操作,例load,ajax,get,post等等, 所以使用jQuery開發ajax將變得極其簡單,我們就可以集中精力在業務和用戶的體驗上 ,不需要去理會那些繁瑣的XMLHttpRequest對象了。
12jquery中$.get()提交和$.post()提交有區別嗎?
答: 1 $.get() 方法使用GET方法來進行異步請求的。 $.post() 方法使用POST方法來進行異步請求的。 2 get請求會將參數跟在URL后進行傳遞,而POST請求則是作為HTTP消息的實體 內容發送給Web服務器的,這種傳遞是對用戶不可見的。 3 get方式傳輸的數據大小不能超過2KB 而POST要大的多 4 GET 方式請求的數據會被瀏覽器緩存起來,因此有安全問題。
13 jquery中的load方法一般怎么用的?
答:load方法一般在 載入遠程HTML 代碼並插入到DOM中的時候用 通常用來從Web服務器上獲取靜態的數據文件。 如果要傳遞參數的話,可以使用$.get() 或 $.post()
14 在jquery中你是如何去操作樣式的?
答: addClass() 來追加樣式 removeClass() 來刪除樣式 toggle() 來切換樣式
15 簡單的講敘一下jquery是怎么處理事件的,你用過哪些事件?
答: 首先去裝載文檔,在頁面家在完畢后,瀏覽器會通過javascript 為DOM 元素添加事件。
16 你使用過jquery中的動畫嗎,是怎樣用的? 答:使用過。
hide()和 show() 同時修改多個樣式屬性。像高度,寬度,不透明度。 fadeIn() 和fadeOut() fadeTo() 只改變不透明度 slideUp() 和slideDown() slideToggle() 只改變高度 animate() 屬於自定義動畫的方法.
17 你使用過jquery中的插件嗎? 答:看個人的實力和經驗來回答了。
18 你一般用什么去提交數據,為什么?
答:一般我會使用的是$.post()方法。 如果需要設定beforeSend(提交前回調函數),error(失敗后處理),success(成功后處理) 及complete(請求完成后處理)回調函數等,這個時候我會使用$.ajax()
19 在jquery中引入css有幾種方式?
答:四種 行內式,內嵌式,導入式,鏈接式
20 你在jquery中使用過哪些插入節點的方法,它們的區別是什么? 答:append(),appendTo(),prepend(),prependTo(),after(),insertAfter() before(),insertBefore() 大致可以分為 內部追加和外部追加 append() 表式向每個元素內部追加內容。 appendTo() 表示 講所有的元素追加到指定的元素中。 例$(A)appendTo(B) 是將A追加到B中 下面的方法解釋類似
21 你使用過包裹節點的方法嗎,包裹節點有方法有什么好處?
答: wrapAll(),wrap(), wrapInner() 需要在文檔中插入額外的結構化標記的時候可以使用這些包裹的方法 應為它不會帛畫原始文檔的語義
22 jquery中如何來獲取或和設置屬性? jQuery中可以用attr()方法來獲取和設置元素屬性 removeAttr() 方法來刪除元素屬性
23 如何來設置和獲取HTML 和文本的值?
答:html()方法 類似於innerHTML屬性 可以用來讀取或者設置某個元素中的HTML內容 注意:html() 可以用於xhtml文檔 不能用於xml文檔 text()類似於innerText屬性 可以用來讀取或設置某個元素中文本內容。 val() 可以用來設置和獲取元素的值
24 你jquery中有哪些方法可以遍歷節點?
答 :children() 取得匹配元素的子元素集合,只考慮子元素不考慮后代元素 next() 取得匹配元素后面緊鄰的同輩元素 prev() 取得匹配元素前面緊鄰的同輩元素 siblings() 取得匹配元素前后的所有同輩元素 closest() 取得最近的匹配元素 find() 取得匹配元素中的元素集合包括子代和后代
25 子元素選擇器 和后代選擇器元素有什么區別?
答:子代元素是找子節點下的所有元素,后代元素是找子節點或子節點的子節點中的元素
26 在jquery中可以替換節點嗎?
答:可以 在jQuery中有兩者替換節點的方式 replaceWith() 和 replaceAll() 例如在<p title="hao are you">hao are you</p>替換成 <strong>I amfine<strong> $('p').replaceWith('<strong>I amfine</strong>'); replaceAll與replaceWith的用法前后調換一下即可。
27你覺得beforeSend方法有什么用?
答:發送請求前可以修改XMLHttpRequest對象的函數,在beforeSend中 如果返回false 可以取消本次的Ajax請求。XMLHttpRequest對象是唯一的參數 所以在這個方法里可以做驗證
28 siblings() 方法 和 $('prev~div')選擇器是一樣的嘛?
答: $('prev~div') 只能選擇'#prev'元素后面的同輩<div>元素 而siblings()方法與前后的文職無關,只要是同輩節點就都能匹配。
29你在ajax中使用過JSON嗎,你是如何用的?
答:使用過,在$.getJSON()方法的時候就是。 因為 $.getJSON() 就是用於加載JSON文件的
30 有哪些查詢節點的選擇器?
答:我在公司使用過 :first 查詢第一個,:last 查詢最后一個,:odd查詢奇數但是索引從0開始 :even 查詢偶數,:eq(index)查詢相等的 ,:gt(index)查詢大於index的 ,:lt查詢小於index :header 選取所有的標題等
31 nextAll() 能 替代$('prev~siblindgs')選擇器嗎?
答:能。 使用nextAll()和使用$('prev~siblindgs') 是一樣的
32 jQuery中有幾種方法可以來設置和獲取 樣式
答 :addClass() 方法,attr() 方法
33 $(document).ready()方法和window.onload有什么區別?
答: 兩個方法有相似的功能,但是在實行時機方面是有區別的。 1 window.onload方法是在網頁中所有的元素(包括元素的所有關聯文件)完全 加載到瀏覽器后才執行的。 2 $(document).ready() 方法可以在DOM載入就緒時就對其進行操縱,並調用 執行綁定的函數。
34 jQuery是如何處理緩存的?
答 :要處理緩存就是禁用緩存. 1 通過$.post() 方法來獲取數據,那么默認就是禁用緩存的。 2 通過$.get()方法 來獲取數據,可以通過設置時間戳來避免緩存。 可以在URL后面加上+(+new Date) 例 $.get('ajax.xml?'+(+newDate),function () { //內容 }); 3通過$.ajax 方法來獲取數據,只要設置cache:false即可。
35 $.getScript()方法 和 $.getJson() 方法有什么區別?
答: 1 $.getScript() 方法可以直接加載.js文件,並且不需要對javascript文件進行處理 ,javascript文件會自動執行。 2 $.getJson() 是用於加載JSON 文件的 ,用法和$.getScript()
36 你讀過有關於jQuery的書嗎? 《jquery基礎教程》 《jquery實戰》 《鋒利的jquery》《巧用jquery》 《jQuery用戶界面庫學習指南》等
37 $("#msg").text(); 和 $("#msg").text("<b>newcontent</b>");有什么區別?
答:1 $("#msg").text() 是返回id為msg的元素節點的文本內容 2$("#msg").text("<b>new content</b>"); 是 將“<b>new content</b>” 作為普通文本串寫入id為msg的元素節點內容中, 頁面顯示粗體的<b>new content</b>
38 radio單選組的第二個元素為當前選中值,該怎么去取?
答 :$('input[name=items]').get(1).checked = true;
39 選擇器中 id,class有什么區別?
答:在網頁中 每個id名稱只能用一次,class可以允許重復使用
40 你使用過哪些數據格式,它們各有什么特點?
答: HTML格式 ,JSON格式,javascript格式,XML格式 1HTML片段提供外部數據一般來說是最簡單的。 2如果數據需要重用,而且其他應用程序也可能一次受到影響,那么在性能和文件大小方面具有優勢的JSON通常是不錯的選擇。 3 而當遠程應用程序未知時,XML則能夠為良好的互操作性提供最可靠的保證。
41 jQuery 能做什么?
答:1 獲取頁面的元素 2 修改頁面的外觀 3 改變頁面大的內容 4 響應用戶的頁面操作 5 為頁面添加動態效果 6 無需刷新頁面,即可以從服務器獲取信息 7 簡化常見的javascript任務
42 在ajax中data主要有幾種方式?
答 : 三種,html拼接的,json數組,form表單經serialize()序列化的。
43 :jQuery中的hover()和toggle()有什么區別?
答 hover()和toggle()都是jQuery中兩個合成事件。 hover()方法用於模擬光標懸停事件。 toggle()方法是連續點擊事件。
44 你知道jQuery中的事件冒泡嗎,它是怎么執行的,何如來停止冒泡事件? 答: 知道, 事件冒泡是從里面的往外面開始觸發。 在jQuery中提供了stopPropagation()方法可以停止冒泡。
45 例如 單擊超鏈接后會自動跳轉,單擊"提交"按鈕后表單會提交等,有時候我想阻止這些默認的行為,該怎么辦?
答: 可以用event.preventDefault() 或 在事件處理函數中返回false,即 return false;
46.jquery表單提交前有幾種校驗方法?分別為??
formData:返回一個數組,可以通過循環調用來校驗 jaForm:返回一個jQuery對象,所有需要先轉換成dom對象 fieldValue:返回一個數組 beforeSend()
47.在jquery中你有沒有編寫過插件,插件有什么好處?你編寫過那些插件?它應該注意那些?
答: 插件的好處:對已有的一系列方法或函數的封裝,以便在其他地方重新利用,方便后期維護和提高開發效率 插件的分類:封裝對象方法插件、封裝全局函數插件、選擇器插件 注意的地方: 1.插件的文件名推薦命名為jquery.[插件名].js,以免和其他的javaScript庫插件混淆 2.所有的對象方法都應當附加到jQuery.fn對象上,而所有的全局函數都應當附加到jQuery對象本身上 3.插件應該返回一個jQuery對象,以保證插件的可鏈式操作 4.避免在插件內部使用$作為jQuery對象的別名,而應使用完整的jQuery來表示,這樣可以避免沖突或使用閉包來避免 5.所有的方法或函數插件,都應當一分好結尾,否則壓縮的時候可能出現問題。在插件頭部加上分號,這樣可以避免他人的不規范代碼給插件帶來影響 6.在插件中通過$.extent({})封裝全局函數,選擇器插件,擴展已有的object對象 通過$.fn.extend({})封裝對象方法插件
48.怎樣給jquery動態附加新的元素?那么怎樣給新生成的元素綁定事件呢? jQuery的html()可以給現在元素附加新的元素 直接在元素還未生成前就綁定肯定是無效的,因為所綁定的元素目前根本不存在。 所以我們可以通過live和livequery來動態綁定事件