- Jquery 中, $(document).ready()是什么意思?和window.onload 的區(qū)別? 還有其他什么寫法或者替代方法?
- $(document).ready(): 是DOM結(jié)構繪制完畢后就執(zhí)行,不必等到加載完畢,可以同時編寫多個,并且都可以執(zhí)行。
- window.onload:必須等到頁面內(nèi)包括圖片的所有元素加載完畢后才能執(zhí)行。 不能同時編寫多個,如果有多個window.onload方法,只會執(zhí)行一個。
- 其他寫法
$(document).ready(handler)
$().ready(handler)
$(handler)
$node.html()和$node.text()的區(qū)別?
$node.html():獲取集合中第一個匹配元素的HTML內(nèi)容.不加參數(shù)時和innerHTML相似。當有參數(shù)時html(str),修改元素的innerHTML為參數(shù)值。
$node.text():得到匹配元素集合中每個元素的合并文本和innerText方法類似。只能匹配到文本不能匹配標簽,當有參數(shù)時text(str),修改元素的文本為參數(shù)值。
$.extend 的作用和用法?
$.extend:將兩個或更多對象的內(nèi)容合并到第一個對象,它有兩種方式。
-
jQuery.extend( target [, object1 ] [, objectN ] ):將object1、object2、objectN…的內(nèi)容合并到target中,改變了target本身的內(nèi)容。
-
jQuery.extend( [deep ], target, object1 [, objectN ] ):增加第一個布爾值參數(shù),決定此方法為深拷貝。更像是一個添加更改的方式而不是完全的替換。
JQuery 的鏈式調(diào)用是什么?
是指在執(zhí)行完一個函數(shù)之后通過
return this
返回本身,然后繼續(xù)執(zhí)行后面的函數(shù)
$('#id').find('li').show();
- JQuery ajax 中緩存怎樣控制?
- 在使用JQuery ajax時設置參數(shù)cache為 false,它的工作原理是在GET請求參數(shù)中附加為
new date()
對象"_={timestamp}"的時間戳。這樣每次訪問的地址都不一樣,也就不會緩存文件了。
ajax({
//...
cache: false,
//...
});
- jquery 中 data 函數(shù)的作用
- data:在匹配元素上存儲任意相關數(shù)據(jù)。.data()方法允許我們在DOM元素上綁定任意類型的數(shù)據(jù),避免了循環(huán)引用的內(nèi)存泄漏風險。
- .data( key, value ):存儲的數(shù)據(jù)value到key上。
- .data( obj ):更新數(shù)據(jù)的 鍵/值
$("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 ] }
- 寫出以下功能對應的 Jq 方法:
1 給元素 $node 添加 class active,給元素 $noed 刪除 class active
$node.addClass('active');//Element.classList.add(str);相似
$node.removeClass('active');//Element.classList.remove(str);相似
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', 'str');
$node.attr('src', 'str');
$node.attr('title', 'str');
$node.removeAttr('title')//刪除屬性
4 給$node 添加自定義屬性data-src
$node.attr('data-src', 'str');
5 在$ct 內(nèi)部最開頭添加元素$node
$ct.prepend($node);
6 在$ct 內(nèi)部最末尾添加元素$node
$ct.append($node);
7 刪除$node
$node.remove();//刪除的同時刪除事件
$node.detach();//保存所有jQuery數(shù)據(jù)和被移走的元素相關聯(lián)。當需要移走一個元素,不久又將該元素插入DOM時,這種方法很有用。
8 把$ct里內(nèi)容清空
$ct.empty();
9 在$ct 里設置 html <div class="btn"></div>
$ct.html('<div class="btn"></div>);
10 獲取、設置$node 的寬度、高度(分別不包括內(nèi)邊距、包括內(nèi)邊距、包括邊框、包括外邊距)
//不包括內(nèi)邊距、外邊距、邊框
$node.width();
$node.height();
//包括內(nèi)邊距
$node.innerWidth();
$node.innerHeight();
//包括內(nèi)邊距、邊框
$node.outerWidth();
$node.outerHeight();
//包括內(nèi)邊距、邊框、外邊距
$node.outerWidth(true);
$node.outerHeight(true);
11 獲取窗口滾動條垂直滾動距離
$(window).scrollTop();
12 獲取$node 到根節(jié)點水平、垂直偏移距離
$node.offset();//返回left,top兩個參數(shù)
$node.offset().left;
$node.offset().top;
13 修改$node 的樣式,字體顏色設置紅色,字體大小設置14px
$node.css('color', 'red');
$node.css('fontSize', '14px');
$node.css({'color':'red','font-size':'14px'});
14 遍歷節(jié)點,把每個節(jié)點里面的文本內(nèi)容重復一遍
$node.each(function(){
console.log($(this).text());
})
15 從$ct 里查找 class 為 .item的子元素
$ct.find('.item');
16 獲取$ct 里面的所有孩子
$ct.children();
17 對于$node,向上找到 class 為’.ct’的父親,在從該父親找到’.panel’的孩子
$node.parent('.ct').find('.panel');
18 獲取選擇元素的數(shù)量
$node.length;
19 獲取當前元素在兄弟中的排行
$node.index();
- 簡單實現(xiàn)以下操作
1 當點擊$btn 時,讓 $btn 的背景色變?yōu)榧t色再變?yōu)樗{色
代碼1
2 當窗口滾動時,獲取垂直滾動距離
代碼2
3 當鼠標放置到$div 上,把$div 背景色改為紅色,移出鼠標背景色變?yōu)榘咨?br> 代碼3
4 當鼠標激活 input 輸入框時讓輸入框邊框變?yōu)樗{色,當輸入框內(nèi)容改變時把輸入框里的文字小寫變?yōu)榇髮懀斴斎肟蚴ソ裹c時去掉邊框藍色,控制臺展示輸入框里的文字
代碼4
5 當選擇 select 后,獲取用戶選擇的內(nèi)容
代碼5 - 用 jquery ajax 實現(xiàn)如下效果。當點擊加載更多會加載數(shù)據(jù)展示到頁面。當鼠標放置上去會變色
http://jrgzuoye.applinzi.com/作業(yè)安排/jscode/JS9-jqueryajax/1.html
代碼6
<?php
// 后端 php 測試接口文件
$start = $_GET['start']; //2
$len = $_GET['len']; //6
$items = array();
for($i = 0; $i < $len; $i++){
array_push($items, '內(nèi)容' . ($start+$i));
}
$ret = array('status'=>1, 'data'=>$items);
//{status: 1, data: ['內(nèi)容1','內(nèi)容2','內(nèi)容3']}
sleep(0.5);
echo json_encode($ret);
本博客版權歸 本人和饑人谷所有,轉(zhuǎn)載需說明來源