jQuery常用方法&ajax

1. Jquery 中， $(document).ready()是什么意思？和window.onload 的区别？还有其他什么写法或者替代方法？

$(document).ready()可以传递函数给.ready()，当DOM准备就绪的时候，执行传递的函数。因为有时执行的代码需要在元素被加载之后才能使用，（例如，取得图片的大小需要在图片被加载完后才能知道），就需要将这样的代码放到 load 事件中。
用法：

  $(document).ready(handler)

还可以写成这样：$(handler)，如：

 $(function(){
       console.log('ready');
 });

window.onload是原生js中的一个事件，可以绑定事件处理函数，其作用也是使得事件加载完成之后才出发事件，执行事件处理函数。事件处理函数的绑定方式有：

  window.onload=function(){}
  window.addEventListener("load",handler,false);

2. $node.html()和$node.text()的区别?

.html()用于获取元素里面的html内容，包括html标签和文本；.text()用于获取只元素中的文本，如果元素中含有多个元素，则返回每个元素中的文本。

1.jpg

3. $.extend 的作用和用法?

$.extend()的作用是可以合并多个对象，
如：

 var obj= $.extend( object1, object2,object3 );
   //此代码将后面两个对象object2和object3的所有属性都添加到object1，后面的覆盖前面的，且会更改目标对象object1。浅拷贝，不递归。obj===object1
 var obj= $.extend( {},object1, object2,object3 );
  //此段代码将后面三个对象的属性都添加到第一个空对象中，不会更改后面的三个对象，而是组成了一个新对象。obj !== object1
var obj= $.extend( true,{},object1, object2,object3 );
 //此段代码在最前面加上true，会采用递归的方式进行添加拷贝，（对象中又包裹对象时会逐个添加每个属性及其对应的值。），且不会更改object1.

例1（修改第一个对象，浅拷贝）：

<div id="log"></div>
<script>
     var object1 = {apple: 0,banana: { weight: 52, price: 100 },cherry: 97};
     var object2 = {banana: { price: 200 },durian: 100};
     // Merge object2 into object1
     $.extend( object1, object2 );
    // Assuming JSON.stringify - not available in IE<8
    $( "#log" ).append( JSON.stringify( object1 ) );
</script>

结果：{"apple":0,"banana":{"price":200},"cherry":97,"durian":100}
例2（不修改第一个对象，深拷贝）：

<div id="log1"></div>
<div id="log"></div>
<script>
     var object1 = {apple: 0,banana: { weight: 52, price: 100 },cherry: 97};
     var object2 = {banana: { price: 200 },durian: 100};
     var obj = $.extend( true, {}, object1, object2 );
     $( "#log1" ).append( JSON.stringify( object1 ) );
     $( "#log" ).append( JSON.stringify( obj ) );
</script>

结果：
{"apple":0,"banana":{"weight":52,"price":100},"cherry":97}
{"apple":0,"banana":{"weight":52,"price":200},"cherry":97,"durian":100}

4. JQuery 的链式调用是什么？

像这样一段代码：

     $("#btn").css("color","red").attr("href","#");

就是jQuery的方法链。链式调用的优点是：

让调用过程更接近自然语言。
把原本参数列表复杂的方法化作多个参数列表简单的方法来使用。
减少不必要的代码量。

5. JQuery ajax 中缓存怎样控制?

用参数cache控制。
cache: 是否开启缓存，默认为true开启。设置为false则是关闭自动缓存。
浏览器自动缓存可以直接在本地缓存中查找文件，减少向服务器请求的次数，提高处理速度，但是有些情况下我们不需要其缓存，因为可能无法得到最新的数据，比如‘天气’、‘路况’等信息，当我们向浏览器请求是需要得到实时的最新数据，而不是以前缓存在本地的数据，这种情况可以关闭缓存。
另一种做法是在请求地址后面添加参数，如：

<script src='abc.js?v=1'></script>

更改了文件第二次上线时可以直接更改地址后面的参数值，<script src='abc.js?v=2'></script>，由于src不同了，所以浏览器不会再用本地缓存，会重新发送请求，从而拿到最新的abc.js文件。

6. jquery 中 data 函数的作用

.data()用于在匹配元素上存储任意相关数据或返回匹配的元素集合中的第一个元素的给定名称的数据存储的值。

 $("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 ] }

最后编辑于：2017.12.05 03:00:28