問答
- Jquery 中$(document).ready()是什么意思？和window.onload 的區(qū)別?還有其他什么寫法或者替代方法？
如果你想要一個(gè)事件運(yùn)行在你的頁面上，你必須$(document).ready()里調(diào)用這個(gè)事件。所有包括在$(document).ready()里面的元素或事件都將會在DOM完成加載之后立即加載，并且在頁面內(nèi)容加載之前。
區(qū)別：
1、window.onload只能編寫一個(gè)，即使編寫多個(gè)也只執(zhí)行一個(gè)，而$(document).ready()則可編寫多個(gè)并且都可得到執(zhí)行；
2、window.onload需要等到頁面所有的元素（含圖片的加載）加載完成后才執(zhí)行，而$(document).ready()只需等到DOM準(zhǔn)備就緒時(shí)就執(zhí)行（不必等待所有元素加載完后再執(zhí)行）；
3、window.onload是原生js中的，而 $(document).ready()需在調(diào)用jquery庫后才能使用；
4、window.onload不可簡寫，而$(document).ready()可簡寫成
$(function(){})
或者
$().ready(function(){})
2.$node.html()和$node.text()的區(qū)別?
- $node.html()是獲取集合中第一個(gè)匹配元素的html內(nèi)容;當(dāng)()里面含有參數(shù)時(shí)則表示設(shè)置每個(gè)匹配元素的html內(nèi)容；
- $node.text()是獲取匹配集合中每個(gè)元素的合并文本，包括他們的后代;當(dāng)()里含有參數(shù)時(shí)，表示設(shè)置每個(gè)匹配元素的文本內(nèi)容為指定文本內(nèi)容；另外，$node.text()與$node.html()的不同在于$node.text()能夠在xml文檔中使用，而html不可以。
3.$.extend 的作用和用法?
$.extend的作用是將兩個(gè)或以上的對象內(nèi)容合并到第一個(gè)對象；
舉個(gè)例子
4.JQuery 的鏈?zhǔn)秸{(diào)用是什么？
$('.ct').hide(3000).show(2000).css('background-color','yellow');
3秒隱藏后，3秒出現(xiàn)，背景色變?yōu)辄S色。（這里有個(gè)小問題，按鈕點(diǎn)擊后背景色馬上變?yōu)辄S色 且同時(shí)發(fā)生hide動作，自以為大概是語句執(zhí)行的快，展示動作慢）
例子 JS bin
5.JQuery ajax 中緩存怎樣控制?
1 .在請求的url后面加上一個(gè)隨機(jī)參數(shù)（*.do?random=Math.random)；
2.給jquery ajax請求設(shè)置禁用緩存的全局設(shè)置我們都知道在jquery ajax的的方法中有個(gè)cache參數(shù)，如果設(shè)置為false，那么就不進(jìn)行緩存。用ajaxSetup() 方法，該方法可以為所有的ajax請求統(tǒng)一設(shè)置默認(rèn)參數(shù)。那么可以設(shè)置如下代碼：
$(function(){ $.ajaxSetup ({
cache: false ;//關(guān)閉AJAX緩存
});
});
6.jquery 中 data 函數(shù)的作用。
代碼
寫出以下功能對應(yīng)的 Jq 方法：
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');//獲取id
$node.attr('src');//獲取src
$node.attr('title');//獲取title
$node.attr('id','value');//修改id
$node.attr('src','value');//修改src
$node.attr('title','value');//修改title
4.給$node 添加自定義屬性data-src
$node.attr('data-src','value');
5.在$ct 內(nèi)部最開頭添加元素$node
$ct.pretent($node);
6.在$ct 內(nèi)部最末尾添加元素$node
$ct.append($node);
7.刪除$node
$node.remove();
8.把$ct里內(nèi)容清空
$ct.empty();
9.在$ct 里設(shè)置 html <div class="btn"></div>
$ct.html('<div class="btn"></div>');
10.獲取、設(shè)置$node 的寬度、高度(分別不包括內(nèi)邊距、包括內(nèi)邊距、包括邊框、包括外邊距)
//不包括內(nèi)邊距
$node.width();//獲取寬度
$node.height();//獲取高度
$node.width('value');//設(shè)置寬度
$node.height('value');//設(shè)置高度
//包括內(nèi)邊距
$node.innerWidth();//獲取包括內(nèi)邊距的寬度
$node.innerHeight();//獲取包括內(nèi)邊距的高度
$node.innerWidth('value');//設(shè)置包括內(nèi)邊距的寬度
$node.innerHeight('value');//設(shè)置包括內(nèi)邊距的高度
//包括邊框
$node.outerWidth();//獲取包括邊框?qū)挾?$node.outerHeight();//獲取包括邊框高度
$node.outerWidth('value');//設(shè)置包括邊框?qū)挾?$node.outerHeight('value');//設(shè)置包括邊框高度
//包括外邊距
$node.outerWidth(true);//獲取包括外邊距寬度
$node.outerHeight(true);//獲取包括外邊距高度
11.獲取窗口滾動條垂直滾動距離
$node.scollTop();
12獲取$node 到根節(jié)點(diǎn)水平、垂直偏移距離
$node.offset();//返回到根節(jié)點(diǎn)的top和left值
13.修改$node 的樣式，字體顏色設(shè)置紅色，字體大小設(shè)置14px
$node.css({
'color': 'red',
'font-size': '14px';
});
14.遍歷節(jié)點(diǎn)，把每個(gè)節(jié)點(diǎn)里面的文本內(nèi)容重復(fù)一遍
$node.each(function(idx,val){
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;
19.獲取當(dāng)前元素在兄弟中的排行
$node.index();
代碼2 代碼預(yù)覽
代碼3 代碼預(yù)覽
本文版權(quán)歸作者饑人谷_Josh和饑人谷所有，轉(zhuǎn)載請注明來源