1.Jquery 中谎碍， $(document).ready()是什么意思隆敢？和window.onload 的區(qū)別奉瘤？ 還有其他什么寫法或者替代方法翠忠？
- 二者的區(qū)別如下圖：
task26-1.png
- 參考資料：鋒利的jquery-09頁
2.$node.html()和$node.text()的區(qū)別?
- Node(節(jié)點(diǎn))是DOM層次結(jié)構(gòu)中的任何類型的對(duì)象的通用名稱，Node有很多類型鬓照，如元素節(jié)點(diǎn)熔酷，屬性節(jié)點(diǎn)，文本節(jié)點(diǎn)豺裆，注釋節(jié)點(diǎn)等拒秘，通過NodeType區(qū)分号显，常見的有：
task26-2.png
Element繼承了Node類，也就是說Element是Node多種類型中的一種躺酒，即當(dāng)NodeType為1時(shí)Node即為ElementNode押蚤，另外Element擴(kuò)展了Node，Element擁有id羹应、class揽碘、children等屬性。
- $node.html()是獲取元素的html內(nèi)容
- $node.text()是獲取元素文本內(nèi)容
demo
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"> </script>
<title>JS Bin</title>
</head>
<body>
<p>這是一個(gè) <b>加粗的 </b> 段落</p>
<script>
$(function(){
$("p").on('click',function(){
console.log($('p').html())
})
$("p").on('click',function(){
console.log($('p').text())
})
})
</script>
</body>
</html>
3.$.extend 的作用和用法?
- 作用：將兩個(gè)或更多對(duì)象的內(nèi)容合并到第一個(gè)對(duì)象园匹。
- 寫法：
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ì)象的值覆蓋 - 用法1：合并兩個(gè)對(duì)象紊馏，并修改第一個(gè)對(duì)象
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"> </script>
</head>
<body>
<div id="log"></div>
<div id="ct"></div>
<script>
var object1 = {
apple: 0,
banana: {weight: 52, price: 100},
cherry: 97
};
var object2 = {
banana: {price: 200},
durian: 100
};
$.extend(object1, object2);
$("#log").append(JSON.stringify(object1));
</script>
</body>
</html>
demo演示 - 采用遞歸方式合并兩個(gè)對(duì)象料饥，并修改第一個(gè)對(duì)象。
jQuery.extend( [true], target, object1 [, objectN ] )如果將 true
作為該函數(shù)的第一個(gè)參數(shù)朱监，那么會(huì)在對(duì)象上進(jìn)行遞歸的合并,若設(shè)置了 deep參數(shù)岸啡，對(duì)象和數(shù)組也會(huì)被合并進(jìn)來，但是對(duì)象包裹的原始類型赫编，比如String, Boolean, 和 Number是不會(huì)被合并進(jìn)來的巡蘸。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"> </script>
</head>
<body>
<div id="log"></div>
<div id="ct"></div>
<script>
var object1 = {
apple: 0,
banana: {weight: 52, price: 100},
cherry: 97
};
var object2 = {
banana: {price: 200},
durian: 100
};
$.extend(true,object1, object2);
$("#log").append(JSON.stringify(object1));
</script>
</body>
</html>
demo演示 - 合并 defaults 和 options 對(duì)象，并且不修改 defaults 對(duì)象擂送。這是常用的插件開發(fā)模式悦荒。
jQuery.extend({}， [, object1 ] [, objectN ] )
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
</head>
<body>
<div id="log"></div>
<div id="ct"></div>
<script>
var object1 = {
apple: 0,
banana: {weight: 52, price: 100},
cherry: 97
};
var object2 = {
banana: {price: 200},
durian: 100
};
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>
demo
4.JQuery 的鏈?zhǔn)秸{(diào)用是什么嘹吨？
- 對(duì)發(fā)生在同一個(gè)jQuery對(duì)象上的一組動(dòng)作了搬味，可以直接連寫而無需重復(fù)獲取對(duì)象
$('div').removeClass('hover').addClass('focus'),silbings.show()- 這么做的好處是讓代碼更加簡(jiǎn)潔易讀，減少重復(fù)性代碼蟀拷，提高性能碰纬。其中的原理是執(zhí)行完一個(gè)方法后就返回對(duì)象本身（return this），然后對(duì)象繼續(xù)執(zhí)行后面的方法问芬。
5.JQuery ajax 中緩存怎樣控制?
- jQuery ajax方法中是利用cache參數(shù)來控制緩存悦析。
設(shè)置為true將緩存頁面（默認(rèn)為ture， dataType為”script”和”jsonp”時(shí)默認(rèn)為false此衅。）强戴，如果設(shè)置為false亭螟，瀏覽器將不會(huì)緩存頁面。
$.ajax不緩存版本
$.ajax({
type:"GET"
url:'test.html',
cache:false,
dataType:"html",
success:function(msg){
alert(msg); }
});
6.jquery 中 data 函數(shù)的作用
- **描述: **在匹配元素上存儲(chǔ)任意相關(guān)數(shù)據(jù).
-
.data( key, value )
$("body").data("foo", 52);
$("body").data("bar", { myType: "test", count: 40 });
$("body").data({ baz: [ 1, 2, 3 ] });
$("body").data("foo"); // 52
$("body").data(); // { foo: 52, bar: { myType: "test", count: 40 }, baz: [ 1, 2, 3 ] } -
描述:返回匹配的元素集合中的第一個(gè)元素的給定名稱的數(shù)據(jù)存儲(chǔ)的值酌泰。 通過.data(name, value)或HTML5 data-* 屬性設(shè)置:
.data( key )
alert($('body').data('foo'));
alert($('body').data());
alert( $("body").data("foo")); //undefined
$("body").data("bar", "foobar");
alert( $("body").data("bar")); //foobar
