問答
1.jQuery中，$(document).ready()是什么意思？和window.onload 的區(qū)別糠溜？ 還有其他什么寫法或者替代方法？
$(document).ready()意思是等待頁(yè)面中的DOM元素加載完畢后執(zhí)行代碼押袍。
與window.onload的區(qū)別：
執(zhí)行的時(shí)機(jī)：
window.onload必須等待網(wǎng)頁(yè)中的所有的內(nèi)容加載完畢后（包括圖片）才能執(zhí)行。
$(document).ready()只需要在頁(yè)面中所有的DOM結(jié)構(gòu)繪制完畢后就執(zhí)行凯肋，可能與DOM元素關(guān)聯(lián)的東西并沒有加載完谊惭。編寫的個(gè)數(shù)：
window.onload只能編寫一個(gè)。如果編寫多個(gè)只會(huì)執(zhí)行最后一個(gè)window.onload代碼侮东。
$(document).ready()能同時(shí)編寫多個(gè)圈盔，根據(jù)編寫順序依次執(zhí)行。簡(jiǎn)寫方式：
$(document).ready()可以簡(jiǎn)寫成：
$(function(){//code})
當(dāng)$()不帶參數(shù)時(shí)悄雅，默認(rèn)參數(shù)就是document驱敲，因此還可以簡(jiǎn)寫成：
$().ready(function(){//code})
2.$node.html()和$node.text()的區(qū)別?
$node.html():
當(dāng)html()沒有設(shè)置參數(shù)時(shí)，返回匹配元素集合中第一個(gè)匹配元素的HTML內(nèi)容宽闲。
當(dāng)html()設(shè)置了HTML字符串時(shí)（即.hmlt(htmlString)）众眨，覆蓋匹配元素集合中每個(gè)匹配元素的內(nèi)容握牧。$node.text():
當(dāng)text()沒有設(shè)置參數(shù)時(shí)，返回匹配元素集合中每個(gè)元素的合并文本（刪除HTML標(biāo)記）娩梨，包括它們的后代沿腰。
當(dāng)text()設(shè)置了文本時(shí)（即.text(text)），覆蓋匹配元素集合中每個(gè)匹配元素的內(nèi)容（特殊的字符會(huì)被編碼）狈定。
舉例：
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div class="box1">我是用來測(cè)試html()方法的<em>文檔1</em></div>
<div class="box1">我是用來測(cè)試html()方法的<em>文檔2</em></div>
<div class="box2">我是用來測(cè)試html()方法的<em>文檔3</em></div>
<div class="box2">我是用來測(cè)試html()方法的<em>文檔5</em></div>
<div class="box3">我是用來測(cè)試text()方法的<em>文檔6</em></div>
<div class="box3">我是用來測(cè)試text()方法的<em>文檔7</em></div>
<script src="jquery-3.1.1.js"></script>
<script>
console.log($(".box1").html());//只返回了第一個(gè)匹配的元素
$(".box2").html("<strong>我發(fā)生改變了</strong>")//所有匹配的元素內(nèi)容都發(fā)生了改變颂龙，而且hmlt標(biāo)記有效。
console.log($(".box3").text());//所有匹配的元素都返回了纽什，而且html標(biāo)記刪除了
$(".box3").text("<strong>我也發(fā)生改變了</strong>")//所有匹配的元素內(nèi)容發(fā)生了改變措嵌，但是html標(biāo)記都被編碼了。
</script>
</body>
</html>
3.$.extend 的作用和用法?
- 作用：將兩個(gè)或更多對(duì)象的內(nèi)容合并到第一個(gè)對(duì)象
- 用法：
1.jQuery.extend( target [, object1 ] [, objectN ] )
當(dāng)我們提供兩個(gè)或多個(gè)對(duì)象給$.extend()時(shí)芦缰，對(duì)象的所有屬性都添加到目標(biāo)對(duì)象（target參數(shù)）企巢。
如果目標(biāo)對(duì)象（target參數(shù)）的某個(gè)屬性在附加對(duì)象（ [, object1 ] [, objectN ] ）中沒有，那么這個(gè)屬性會(huì)在合并后保留饺藤。反之包斑，如果附加對(duì)象中的某個(gè)屬性在目標(biāo)對(duì)象中沒有，這個(gè)屬性在合并后也會(huì)保留涕俗。
如果目標(biāo)對(duì)象的某個(gè)屬性在附加對(duì)象中有罗丰，那么這個(gè)屬性的值會(huì)被附加對(duì)象的值覆蓋。
舉例：
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title></title>
<script src="jquery-3.1.1.js"></script>
</head>
<body>
<div id="log"></div>
<script>
var object1 = {
name : "Ben",
age : 20,
body:{heigh:178,weight:60}//body的值會(huì)被覆蓋
};
var object2 = {
body: {weight:70},
sex:"man"
};
$.extend( object1, object2 );
$( "#log" ).append( JSON.stringify( object1 ) );
</script>
</body>
</html>
2.jQuery.extend(true再姑，target [, object1 ] [, objectN ] )
這個(gè)用法多了一個(gè)參數(shù)true萌抵，它會(huì)使合并成為遞歸，也就是深拷貝元镀。
與上面的用法不同處在于如果目標(biāo)對(duì)象的某個(gè)屬性在附加對(duì)象中有绍填，那么這個(gè)屬性的值會(huì)發(fā)生合并。
舉例：
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title></title>
<script src="jquery-3.1.1.js"></script>
</head>
<body>
<div id="log"></div>
<script>
var object1 = {
name : "Ben",
age : 20,
body:{heigh:178,weight:60}//body的值會(huì)發(fā)生合并
};
var object2 = {
body: {weight:70},
sex:"man"
};
$.extend(true, object1, object2 );
$( "#log" ).append( JSON.stringify( object1 ) );
</script>
</body>
</html>
3 .jQuery.extend({}栖疑， [, object1 ] [, objectN ] )
目標(biāo)對(duì)象為{}讨永，這種用法是合并多個(gè)對(duì)象，但是不改變這些對(duì)象遇革。這是常用的插件開發(fā)模式卿闹。
舉例：
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title></title>
<script src="jquery-3.1.1.js"></script>
</head>
<body>
<div id="log"></div>
<script>
var object1 = {
name : "Ben",
age : 20,
body:{heigh:178,weight:60}
};
var object2 = {
body: {
weight:70
},
sex:"man"
};
var object3 = $.extend({}，object1,object2);
$( "#log" ).append( "<div>"+JSON.stringify( object1 )+"</div>" );
$( "#log" ).append( "<div>"+JSON.stringify( object2 )+"</div>" );
$( "#log" ).append( "<div>"+JSON.stringify( object3 )+"</div>" );
</script>
</body>
</html>
4.JQuery 的鏈?zhǔn)秸{(diào)用是什么萝快？
jQuery的鏈?zhǔn)秸{(diào)用就是指對(duì)一個(gè)對(duì)象連續(xù)的使用jQuery方法锻霎，例如：
$(this).removerClass("mouseout").addClass("mouseover").next().show()
這么做的好處是讓代碼更加簡(jiǎn)潔易讀，減少重復(fù)性代碼揪漩，提高性能旋恼。
其中的原理是執(zhí)行完一個(gè)方法后就返回對(duì)象本身（return this），然后對(duì)象繼續(xù)執(zhí)行后面的方法奄容。
5.JQuery ajax 中緩存怎樣控制?
jQuery ajax方法中是利用cache參數(shù)來控制緩存冰更。
設(shè)置為true將緩存頁(yè)面（默認(rèn)為ture产徊， dataType為"script"和"jsonp"時(shí)默認(rèn)為false。）冬殃，如果設(shè)置為false囚痴，瀏覽器將不會(huì)緩存頁(yè)面。
其工作原理是在GET請(qǐng)求參數(shù)中附加“={timestamp}”時(shí)間戳审葬，使請(qǐng)求的鏈接每次都不同深滚。
6.jquery 中 data 函數(shù)的作用？
用法：
1.data(key ,value),在匹配元素上存儲(chǔ)任意相關(guān)數(shù)據(jù)涣觉。
舉例：
$("body").data("foo",52);
$("body").data("bar",{myType:"test",count:40});
$("body").data({baz:[1,2,3]});
console.log($("body").data("foo"));
console.log($("body").data());
2.
.data(key)痴荐，返回匹配的元素集合中的第一個(gè)元素的給定名稱的數(shù)據(jù)存儲(chǔ)的值。舉例：
console.log($("body").data("foo"));//如果指定元素上沒有設(shè)置任何值官册，將返回undefined生兆。
$("body").data("bar","foobar");
console.log($("body").data("bar"));
代碼：
代碼1地址
代碼1預(yù)覽
代碼2地址
代碼2預(yù)覽
代碼3地址
代碼3預(yù)覽
代碼3本地預(yù)覽效果：
本文版權(quán)歸本人和饑人谷所有，轉(zhuǎn)載請(qǐng)注明來源膝宁。
