问答部分

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

$(document).ready()~指当DOM准备就绪时，指定一个函数来执行
window.onload~指当页面全部加载完成（包括页面内容、图片、资源等）时执行相应的函数
两者的区别：
执行时间不同：$(document).ready()只需要当DOM加载好即可；window.onload必须要等到页面所有元素加载完后才能执行
编写个数不同：$(document).ready()可以同时编写多个，并根据编写顺序执行；window.onload只能编写一个，如果编写多个也只执行最后一个
$(document).ready()的简化写法为：$(handler)；window.onload无简写方法

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

.html()~获取集合中第一个匹配元素的HTML内容
.text()~获取匹配元素集合中每个元素的合并文本，包括他们的后代
比如如下代码：

<!doctype html>
<html>
    <head>
        <meta charset="utf-8"/>
        <title>jQuery</title>
    </head>
    <body>
        <p>jirengu<span>hunger</span></p>
    </body>
    <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.js"></script>
    <script>
        $(function(){
            console.log($("p").html());
            console.log($("p").text());
        });
    </script>
</html>

结果如下图：

问答2

三、$.extend 的作用和用法?

作用：将两个或更多对象的内容合并到第一个对象
用法如下：

//目标对象为{}，这种用法是合并多个对象，但是不改变这些对象
jQuery.extend({},object1,object2);
//合并两个对象
jQuery.extend(target[,object1][,object2]);
//deep为true时，合并成为递归（即深拷贝）
jQuery.extend([deep],target[,object1][,object2]);

具体如下示例：

1~

 jQuery.extend(target[,object1][,object2]);

当提供两个或多个对象给$.extend()，对象的所有属性都添加到目标对象（target参数）；目标对象（第一个参数）将被修改，并且将通过$.extend()返回；如果只有一个目标参数提供给$.extend()，意味着目标参数被省略；如果目标对象（target参数）的某个参数在附加对象([,object1][,object2])中没有，那么这个属性会在合并之后被保留；同理，如果附加对象中某个属性在目标对象中没有，这个属性也会在合并之后被保留；如果目标对象的某个属性在附加对象中存在，那么这个属性的值会被附加对象的值所覆盖。如下代码

            var defaults = {
                name:"frank",
                age:25,
                height:176
            };
            var options = {
                name:"hunger",
                age:26,
                weight:63,
                sex:"male"
            };
            $.extend(defaults,options);
            console.log(defaults);

结果如下图：

.extend()用法1

2~

jQuery.extend({},target[,object1][,object2]);

合并defalults和options对象，并且不修改defaults对象；这是常用的插件开发模式，如下代码

          var defaults = {
              name:"frank",
              age:25,
              height:176
          };
          var options = {
              weight:63,
              sex:"male"
          };
          var newObject = $.extend({},defaults,options);
          console.log(defaults);
          console.log(options);
          console.log(newObject);

结果如下图：

.extend()用法2

3~

jQuery.extend(true,target[,object1][,object2]);

当第一个参数为true时，合并会成为递归（即深拷贝），此时，如果目标对象中的某个属性在附加对象中存在时，那么这个属性的值将会合并，如下代码

            var defaults = {
                name:"frank",
                age:25,
                body:{height:176,weight:63}
            };
            var options = {
                name:"hunger",
                sex:"male",
                body:{height:180}
            };
            $.extend(true,defaults,options);
            console.log(defaults);

结果如下图：

.extend()用法3

四、JQuery 的链式调用是什么？

JQuery 的链式调用是指对一个对象连续的使用jQuery方法（原理是：执行完一个方法后就返回对象本身（return this），然后对象继续执行后面的方法），比如如下代码

$("#ct").removeClass("hover").css("color","red").hide("slow");

以上代码对id为ct的对象做了以下操作：移除了hover的class，设置了字体颜色，并隐藏；这样做的好处是代码简洁易读，减少了代码的重复性，提高了性能

五、JQuery ajax 中缓存怎样控制?

JQuery ajax 中利用cache参数来控制缓存，默认的值为true（即缓存页面）；如果设置为 false ，浏览器将不缓存此页面

六、jquery 中 data 函数的作用？

.data(key,value)~在匹配元素上存储任意相关数据，如下代码

        $("body").data("foo", 52);
        $("body").data("bar", { myType: "test", count: 40 });
        $("body").data({ baz: [ 1, 2, 3 , 4 , 5 , 6 ] });
        console.log($("body").data("foo"));
        console.log($("body").data());

问答6

.data(key)~返回匹配的元素集合中的第一个元素的给定名称的数据存储的值，如下代码

        $("body").data("foo");
        $("body").data("bar", "foobar");
        console.log($("body").data("foo"));//undefined,如果指定元素上
没有设置任何值，那么将返回undefined
        console.log($("body").data());//foobar