1Jquery 中, $(document).ready()是什么意思?和window.onload 的区别? 还有其他什么写法或者替代方法?
$(document).ready()
方法,可实现在DOM结构加载完毕后,调用某个函数,而不必等待页面中的图像加载完毕。 JS代码中可编写多个,而且都能被执行。这是为了防止文档在完全加载(就绪)之前运行 jQuery 代码,如果在文档没有完全加载之前就运行函数,操作可能失败。作用相当于我们把js写到body的末尾。
$(document).ready(function(){
todo....
})
简写形式:
$(function(){
todo...
})
window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。不能同时编写多个,如果有多个window.onload方法,只会执行一个。
2.$node.html()和$node.text()的区别?
$node.html()
,返回所选择元素内的html内容,包含html标签和文本内容
$node.text()
,返回所选择元素内的文本内容,不包含html标签,只包含文本内容
<div id="container">
aaa
<span class="ct1">bbbccc</span>
<span class="ct2">dddeee</span>
</div>
$("#container").html()
//返回内容aaa
<div id="container">
aaa
<span class="ct1">bbbccc</span>
<span class="ct2">dddeee</span>
</div>
$("#container").text()
//返回内容
//aaa
//bbbccc
//dddeee
3.$.extend 的作用和用法?
jQuery.extend(target[,object1],[objectN]);
//合并两个对象[object1],[objectN],并修改第一个对象target。
jQuery.extend([deep],target,[object1],[objectN]);
//采用递归方式(true)合并两个对象[object1],[objectN],并修改第一个对象target。
情况一:
target:Object;一个对象,如果有额外的对象传入,那么它将接受新的属性;如果它是唯一的参数,将扩展jQuery的命名空间。
Object1:Object;一个对象,它包含额外的属性,将合并到target中。
ObjectN:Object;额外的对象,它包含额外的属性,将合并到target中。
情况二:
deep:Boolean;如果是true,那么该合并是递归的(又叫做深拷贝).在默认情况下,通过$.extend()的合并操作不是递归的。
target:Object;被扩展的对象,它将接受新的属性。
Object1:Object;同情况一。
ObjectN:Object;同情况一。
当我们提供两个或多个对象给$.extend(),对象的所有属性都添加到目标对象(target参数)。如果只有一个参数提供给$.extend(),这意味着后续目标参数被省略。在这种情况下,jQuery对象本身被默认为目标对象,将扩展jQuery的命名空间。如果我们想保留原对象,我们可以通过传递一个空对象作为目标对象:
var object = $.extend({}, object1, object2);
var object1 = {
apple: 0,
banana: {weight: 52, price: 100},
cherry: 97
};
var object2 = {
banana: {price: 200},
durian: 100
};
$.extend(object1, object2);//返回结果(同名覆盖,不同名的添加):
{"apple":0,"banana":{"price":200},"cherry":97,"durian":100}
$.extend(true, object1, object2);//返回结果(ture递归合并,深拷贝,相同的部分会被替换,不同的部分添加)
{"apple":0,"banana":{"weight":52,"price":200},"cherry":97,"durian":100}
4.JQuery 的链式调用是什么?
使用jquery的方法时,对象上的方法返回的是对象本身,因此能接着使用本对象的其他jQuery方法,这就是链式调用。链式调用可提高代码效率,代码更优雅。 例如:
作用链写法:$div2.slideDown(1000).fadeOut(1000)
//先滑入,然后淡出
作用链写法:
$div3.animate({width:'150',height:'150px'})
.animate({left:'200px'})
.animate({top:'200px'})
.animate({left:'0px'})
.animate({top:'0px'})
.animate({width:'80px',height:'80px'})//可将多个动画效果连接起来依次执行
5.JQuery ajax 中缓存怎样控制?
jquery中调用ajax封装函数时,传入参数中的cache可控制缓存。cache(默认为true):如果设置为 false ,浏览器将不缓存此页面。注意: 只有当使用GET方法时,设置cache为false是有用的,设置cache为 false将在 HEAD和GET请求中正常工作,相当于在GET请求参数中附加"_={timestamp}",这样每次发起请求都会加上不同时间戳形成新的请求并由后台响应,不会从本地缓存中查找。而当使用POST方法时,则每次都会被认为是新的请求,不会缓存页面。
6.jquery 中 data 函数的作用?
可以向元素附加数据,以 .data(key,value)或.data(obj) 的形式
也可以从元素上读取数据,以.data(key)或者.data()的形式。
$( "body" ).data( "foo", 52 );
$( "body" ).data( "bar", { myType: "test", count: 40 } );
$( "body" ).data( { baz: [ 1, 2, 3 ] } );
$( "body" ).data( "foo" ) ; //52
$("body").data("bar"); //{myType: "test", count: 40}
$("body").data("baz"); //[1,2,3]
$( "body" ).data(); // { foo: 52, bar: { myType: "test", count: 40 }, baz: [ 1, 2, 3 ] }
$("div").data("test", { first: 16, last: "pizza!" });
$("div").data("test").first //返回结果16
$("div").data("test").last) //返回结果pizza!
7.常用功能jquery方法
8.常用操作jquery实现
9.加载更多jquery实现(server mock数据)
本文版权归本人和饥人谷所有,转载请注明来源。