Web前端JQuery面試題（二）
1.請寫出jquery的語法？
<script type="text/javascript">
$(document).ready(function(){
// 程序段
})
</script>
window.onload=function(){
// 程序段
}
前者效率高
$(function(){
// 程序段
})
2.請問什么是DOM對象？
DOM對象，DOM為文本對象模型，DOM的每一個頁面都是一個DOM對象。通過JavaScript方法獲取頁面元素的對象，就是DOM對象。
var txt = document.getElementById("text").value;
3.請問什么是jquery對象？
通過jquery自身的方法獲取頁面元素的對象，就是jquery對象。
var txt = $("#text").val();
$("#text").toggleClass("txtClick").html("點擊后切換樣式");
4.jquery選擇器有哪些？
jquery選擇器有：基本選擇器，層次選擇器，過濾選擇器，表單選擇器四大類。
過濾選擇器分6種：簡單過濾選擇器，內容過濾選擇器，可見性過濾選擇器，屬性過濾選擇器，子元素過濾選擇器，表單對象屬性過濾選擇器。
基本選擇器：
#id 根據給定的id進行匹配一個元素
element 根據給定的元素名進行匹配所有元素
.class 根據給定的類匹配該類的所有元素
* 匹配所有元素
selector1,selector2 匹配給定的元素，合並一起
層次選擇器：
ancestor descendant 根據祖先元素匹配所有后代的元素
祖先和后代的關系
parent > child 根據父元素匹配所有的子元素
父子的關系
prev + next 根據prev元素匹配后面的所有相鄰元素
於.next()相同，prev元素后的下一個元素
prev ~ siblings 匹配prev元素后的所有兄弟元素
於.nextAll()相同，prev元素后的所有相鄰元素，獲取元素后面的全部相鄰元素
.siblings()方法，獲取前后所有相鄰的元素
簡單過濾選擇器器：
:animated 獲取執行正在動畫效果的元素
:header 獲取所有標題類型的元素
:lt(index) 獲取小於給定索引值的元素
:gt(index) 獲取大於給定索引值的元素
:eq(index) 獲取給定的索引值的元素，從0開始
:odd 獲取奇數的元素
:even 獲取偶數的元素
:not(selector) 獲取除給定選擇器外的所有元素
first() 或 :first 獲取第一個元素
last() 或 :last 獲取最后一個元素
內容過濾選擇器：
:contains(text) 獲取包含給定文本的元素
:empty 獲取所有不包含子元素或文本的空元素
如：<div></div>
:has(selector) 獲取含所選擇器的所有元素
:parent 獲取含有子元素或文本的元素
如：<div>dashu</div>, <div><p></p></div>
可見性過濾選擇器:
:hidden 獲取所有不可見元素
:visible 獲取所有的可見元素
屬性過濾選擇器：
[attribute]
獲取給定屬性的元素
[attribute = value]
匹配給定的屬性是某個特定值的元素
[attribute != value]
匹配所有不含有特定的屬性
[attribute ^= value]
匹配給定的屬性以某值開始的元素
[attribute $= value]
匹配給定的屬性以某值結尾的元素
[attribute *= value]
匹配有包含某些值的特定元素
[selector1][selector2]
同時滿足多個條件使用
子元素過濾選擇器：
:nth-child
從1開始的，匹配每個父元素下第n個元素
$("ul li:nth-child(2)"); 獲取2 3 4。。
:first-child
匹配每個父元素下的第一個子元素
:last-child
匹配每個父元素下的最后一個子元素
:only-child
匹配父元素中只有唯一的子元素，如果父元素中有多個子元素，就不會被匹配
表單對象屬性過濾選擇器：
:enabled
匹配所有可用元素
:disabled
匹配所有不可用元素
:checked
匹配所有選中元素
:selected
匹配所有選中option元素
表單選擇器：
:input
會獲取所有input,textarea,select,button
:text
匹配所有單行文本元框
:password
匹配所有密碼框
:radio
匹配所有單選按鈕
:checkbox
匹配所有復選框
:submit
匹配所有提交按鈕
:image
匹配所有圖像
:reset
匹配所有重置按鈕
:button
匹配所有按鈕
:file
匹配所有文本域
5.請問你能寫出dom結構嗎？
html下head,body
head下title,style
body下table,div,p,ul
table下tr
div下span
ul下li
6.給定屬性操作，描述作用
attr(): 可以獲取元素的屬性和屬性值
attr(key,value)：可以設置元素的屬性
removeAttr(): 可以刪除指定的屬性
html()： 獲取Html內容
html(val)： 設置Html內容
text()： 獲取元素的文本內容
text(val)： 設置元素的文本內容
val()：
獲取元素的值
val(val)：
為元素設置值
val().join(",")：
獲取選中的多個選項值，用於獲取select中多個選項值
設置元素樣式
css(name,value); name樣式名稱，value樣式值
添加樣式
addClass(class) 和 addClass(class0 class1 ...)
切換樣式
toggleClass(class)如果有該類class就刪除，如果沒有就添加
進行方法間的切換效果
刪除類
removeClass(class);
創建節點元素，動態創建頁面元素: $(html)
var $p = $("<p>dashucoding</p>");
內部插入
append(content) : 向所選擇的元素內部插入內容
$("body").append($div);
append(function (index,html)) 同上
appendTo: 把選擇的元素追加到另一個指定的元素中
appendTo(content)將一個元素插入另一個指定的元素中
前部分的內容插入其后部分的內容
$("span").appentTo($("div"));
prepend(coontent): 向每個所選擇的的元素內部前置內容
prepend(function(index,html))
prependTo(content)
外部插入
after(content): 向所選擇的元素外部后面插入內容
after(function)
before(content): 向所選擇的元素外部前面插入內容
before(function)
insertAfter(content) 選擇的元素插入另一個元素外部后面
insertBefore(content) 選擇元素插入另一個元素外部前面
復制節點
clone()復制元素本身和clone(true)復制元素和所有功能
$(this).clone().appendTo("span"); 和 $(this).clone(true).apendTo("span");
替換節點
replaceWith(content)
將選擇的元素替換成指定內容
$("span").replaceWith("<p>dashu</p>");
replaceAll(selector)
將選擇的元素替換成指定的selector的元素
$("<p>dashu</p>").replaceAll("#text");
包裹節點
wrap(html): 將所有選擇的元素用其他字符串代碼包裹起來
wrap(elem): 將所有選擇的元素用其他Dom元素包裹起來
wrap(fn)
unwrap() 移除所選元素的父元素或包裹的標記
wrapAll(html),wrapAll(elem)
wrapInner(html),wrapInner(elem)
wrapInner(fn)
wrap(html), wrapInner(html);
包裹外部元素
包裹元素內部的文本
<p><span>da</span></p>
$("p").wrap("<b></b>");
<b><p><span>da</span></p></b>
$("span").wrapInner("<i></i>");
<p><span><i>da</i></span></p>
遍歷元素
each()方法進行元素的遍歷
刪除元素
remove()刪除該元素和empty()清空全部節點或所有后代元素
結言
好了，歡迎在留言區留言，與大家分享你的經驗和心得。
感謝你學習今天的內容，如果你覺得這篇文章對你有幫助的話，也歡迎把它分享給更多的朋友，感謝。
達叔小生：往后余生，唯獨有你
You and me, we are family !
90后帥氣小伙，良好的開發習慣；獨立思考的能力；主動並且善於溝通
簡書博客： 達叔小生
https://www.jianshu.com/u/c785ece603d1
結語
- 下面我將繼續對 其他知識 深入講解 ，有興趣可以繼續關注
- 小禮物走一走 or 點贊