題目1： jQuery 中厦章， $(document).ready()是什么意思为牍？
$(document).ready()方法：為防止文檔在完全加載（就緒）之前運行Jquery代碼吕喘。若在文檔未完全加載前就運行函數(shù)漂辐，操作可能失敗显拳。必須在文檔加載完后執(zhí)行操作，可使用ready事件伪很，作用相當(dāng)于把js寫到body末尾戚啥。
$(document).ready(function(){
});
可簡寫為:
$(function(){
})
window.onload：必須等網(wǎng)頁中所有的元素全部加載完畢，才能執(zhí)行
不能同時寫多個锉试，否則后面覆蓋前面猫十。
**題目2： $node.html()和$node.text()的區(qū)別? **
$node.html()，返回所選擇元素內(nèi)的html內(nèi)容呆盖，包含html標(biāo)簽和文本內(nèi)容
$node.text()拖云，返回所選擇元素內(nèi)的文本內(nèi)容，不包含html標(biāo)簽絮短，只包含文本內(nèi)容
**題目3： $.extend 的作用和用法? **
$.extend()將多個對象合并到一起江兢，可以傳入多個參數(shù)。$.extend([deep,] target,…)[deep,]為布爾值默認情況不是深拷貝丁频，可設(shè)置true為深拷貝。
//定義一個對象
var obj={
name:'lulu',
age:27,
sex:'woman'
};
//定義一個新對象
var newObj={
name:'xuxu',
age:20
};
//extend方法接受多個參數(shù),并且第一個對象被覆蓋
$.extend(obj,newObj,{
name:'maomao',
age:25,
like:'eat'
});
console.log(obj);
//object{
//age:25,
//like:"eat",
//name:"maomao",
//sex:"woman"
//
}
題目4： jQuery 的鏈?zhǔn)秸{(diào)用是什么？
當(dāng)jQuery的方法的返回值仍為當(dāng)前對象時可以繼續(xù)調(diào)用該對象的方法席里，這樣就形成一種鏈?zhǔn)秸{(diào)用叔磷。
$(#ct).css('color','blue').show(400).hide();
**題目5： jQuery 中 data 函數(shù)的作用? **
第一種用法：
.data(key,value)：在匹配元素上存儲任意相關(guān)數(shù)據(jù)
$("div").data("people",{age:16,sex:"男"});
console.log( $("div").data("people").age ); //16
第二種用法：
.data(key):返回匹配元素集合中的第一個元素給定成名的數(shù)據(jù)存儲的值晚顷，通過.data(name,value)或HTML 5 data-*屬性（著重）的設(shè)置飘千。
<div data-role="page" data-last-value="43" data-hidden="true" ></div>
下面通過data()函數(shù)獲取里面的值
$("div").data("role") === "page";
$("div").data("lastValue") === 43;
以上代碼的第二條語句正確是表述了該元素的data-last-value屬性有滑。 如果沒有傳遞key參數(shù)的數(shù)據(jù)存儲刀森， jQuery將在元素的屬性中搜索菠剩， 將駝峰式字符串轉(zhuǎn)化為中橫線字符串嗅义，然后在結(jié)果前面加上data-族阅。 所以东跪，該字符串lastValue將被轉(zhuǎn)換為data-last-value躁染。
**題目6： **
寫出以下功能對應(yīng)的 jQuery 方法：
1鸣哀、給元素 $node 添加 class active，給元素 $noed 刪除 class active
$node.addClass('active');//添加
$node.removeClass('active');//刪除
2吞彤、展示元素$node, 隱藏元素$node
$node.show();//展示
$node.hide();//隱藏
3我衬、獲取元素$node 的 屬性: id、src饰恕、title挠羔， 修改以上屬性
$node.attr('id');//獲取
$node.attr('id’,'值'); //修改
$node.attr('src');//獲取
$node.attr('src’,'值');//修改
$node.attr('title');//獲取
$node.attr('title’,'值');//修改
4、給$node 添加自定義屬性data-src
$node.data("src",str)
5埋嵌、在$ct 內(nèi)部最開頭添加元素$node
$(".ct").prepend(node);
6破加、在$ct 內(nèi)部最末尾添加元素$node
$(".ct").append(node);
7、刪除$node
$(node).remove();
8雹嗦、把$ct里內(nèi)容清空
$node.empty();
**9拌喉、在$ct 里設(shè)置 html <div class="btn"></div> **
$ct.html('<div class="btn"></div>')
10、獲取俐银、設(shè)置$node 的寬度尿背、高度(分別不包括內(nèi)邊距、包括內(nèi)邊距捶惜、包括邊框田藐、包括外邊距)
$node.width();//不包括內(nèi)邊距寬度,僅包括內(nèi)容
$node.height();//不包括內(nèi)邊距高度,僅包括內(nèi)容
$node.innerWidth();//包括內(nèi)容和內(nèi)邊距寬度
$node.innerHeight();//包括內(nèi)容和內(nèi)邊距高度
$node.outerWidth();//包括內(nèi)容,內(nèi)邊距,邊框?qū)挾?$node.outerHeight();//包括內(nèi)容,內(nèi)邊距,邊框高度
$node.outerHeight(true);//包括內(nèi)容,內(nèi)邊距,邊框,外邊距高度
$node.outerWidth(true);//包括內(nèi)容,內(nèi)邊距,邊框,外邊距寬度
11、獲取窗口滾動條垂直滾動距離
$(window).scrollTop()
12吱七、獲取$node 到根節(jié)點水平汽久、垂直偏移距離
$node.offset()
13、修改$node 的樣式踊餐，字體顏色設(shè)置紅色景醇，字體大小設(shè)置14px
$node.css({"color":"red","font-size":"14px"})
14、遍歷節(jié)點吝岭，把每個節(jié)點里面的文本內(nèi)容重復(fù)一遍
$node.each(function(){
console.log($(this).text())
})
15三痰、從$ct 里查找 class 為 .item的子元素
$(".ct").find(".item")
16吧寺、獲取$ct 里面的所有孩子
$(".ct").children()
17、對于$node散劫，向上找到 class 為'.ct'的父親稚机，在從該父親找到'.panel'的孩子
$node.parents(".ct").find(".panel")
18、獲取選擇元素的數(shù)量
$node.length;
$node.size();
19获搏、獲取當(dāng)前元素在兄弟中的排行
$node.index();
**題目7： **
用jQuery實現(xiàn)以下操作
1赖条、當(dāng)點擊$btn 時，讓 $btn 的背景色變?yōu)榧t色再變?yōu)樗{色
$("#div1 .btn").on("click",function(){
$(this).css("background-color","red");
setTimeout(function(){
$("#div1 .btn").css("background-color","blue");
},500);
});
2常熙、當(dāng)窗口滾動時纬乍，獲取垂直滾動距離
$(document).on("scroll",function(){
console.log($(this).scrollTop());
});
3、當(dāng)鼠標(biāo)放置到$div 上裸卫，把$div 背景色改為紅色仿贬，移出鼠標(biāo)背景色變?yōu)榘咨?/strong>
$(".btn").on("mouseover",function(){
$(this).css("background-color","red");
});
$(".btn").on("mouseout",function(){
$(this).css("background-color","");
});
4、當(dāng)鼠標(biāo)激活 input 輸入框時讓輸入框邊框變?yōu)樗{色彼城，當(dāng)輸入框內(nèi)容改變時把輸入框里的文字小寫變?yōu)榇髮懽绲?dāng)輸入框失去焦點時去掉邊框藍色，控制臺展示輸入框里的文字
$("input").on("focus",function(){
$(this).css("border","1px solid blue");
});
$("input").on("change",function(){
$(this).val($(this).val().toUpperCase());
});
$("input").on("blur",function(){
$(this).css("border","");
if($(this).val()!=""){
console.log($(this).val());
}
});
5募壕、當(dāng)選擇 select 后调炬，獲取用戶選擇的內(nèi)容
$("#div5 .good").on("change",function(){
//console.log($(this).val());
$("#div5 span").text($(".good option:selected").text());
});
**題目8： 用 jQuery ajax 實現(xiàn)如下效果。`當(dāng)點擊加載更多會加載數(shù)據(jù)展示到頁面效果預(yù)覽4 **
代碼
本地mock成功
