1、jQuery 中， $(document).ready()是什么意思？

为防止文档在完全加载之前运行Jquery代码，若在文档未完全加载前就运行函数，操作可能失败。必须在文档加载完后执行操作，可使用ready事件，作用相当于把js写到body末尾。

//第一种写法
$(document).ready(function(){});
//第二种写法
$(function(){})

window.onload是所有元素、图片、外部资源都加载完执行，而$(document).ready()只需要DOM元素加载完成。

原生写法
document.addEventListener('DOMContentLoaded',function(){
     ......
})

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

$node.html()和$node.text()对应原生DOM中的innerHTML、innerText

$node.html() 是获取或修改目标元素的HTML节点及相关节点的值
$node.text() 只是获取或者修改文本节点内容

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

将两个或多个对象的所有属性，传递给target，目标对象（第一个参数）将被修改，并且将通过$.extend()返回，重复的属性及其值会被覆盖。
第一个参数设置为true，为深拷贝；设置为false，是浅拷贝。不设置默认是浅拷贝

var obj = {}
var obj1 = {
    name:'obj1',
    age:'1',
    friends:[1,2,3]
}
var obj2 = {
    name:'obj2',
    sex:'male'
}
//1浅拷贝
$.extend(obj,obj1)
console.log(obj)  //name:'obj1',age:'1',friends:Array(3)
//深拷贝
$.extend(true,obj,obj1) 
//2
$.extend(obj,obj1,obj2) 
console.log(obj)   //name:'obj2',age:'1',friends:Array(3),sex:'male'
//3
var opts = $.extend({},obj1,obj2)
console.log(opts)   //原理同2,存在的替换，不存在的添加
//4
$.extend($.fn,obj2)
//5
$.fn.extend(obj2)

//.extend常见用法
function getPeople(obj){
    var defalut = {
        name:'hunger',
        age:'30',
        sex:'male'
    }
    //var opts = {}
    var opts = $.extend({},defalut,obj)
    console.log(opts)       
}

jQuery 的链式调用是什么？

$("#Test").css('color','red').show(200).removeClass('style');

上面的例子就是链式操作，在一行代码里，对id为Test的对象进行了三项操作

代码更精简。链式操作能大大精简代码量，多项操作一行代码一气呵成
优化性能。使用链式操作，所有操作代码共享一个jQuery对象，省去了逐步查询DOM元素的性能损耗。

jQuery 中 data 函数的作用？

在匹配元素上存储任意相关数据或返回匹配的元素集合中的第一个元素的给定名称的数据存储的值。
.data() 方法允许我们在DOM元素上绑定任意类型的数据，避免了循环引用的内存泄漏风险。

我们可以在一个元素上设置不同的值，之后获取这些值：

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

通过data()函数存取的数据都是临时数据，一旦页面刷新，之前存放的数据都将不复存在。该函数属于jQuery对象(实例)。如果需要移除通过data()函数存放的数据，可以使用removeData()函数。

以下功能对应的 jQuery 方法：

$node.addClass('active')// 给元素 $node 添加 class active
$node.removeClass('active')// 给元素 $noed 删除 class active

$node.show()// 展示元素$node
$node.hide(5000)// 隐藏元素$node

// 获取元素$node 的 属性: id、src、title
$node.attr('id')
$node.attr('src')
$node.attr('title')
// 修改以上属性
$node.attr('id','xxx')
$node.attr('src','xxx')
$node.attr('title','xxx')
$node.attr('data-src','xxx')// 给$node 添加自定义属性data-src

// 在$ct 内部最开头添加元素$node
$ct.prepend('$node')
$node.prependTo('$ct')
// 在$ct 内部最末尾添加元素$node
$ct.append('$node')
$node.appendTo('$ct')

$node.remove()// 删除$node
$ct.empty()// 把$ct里内容清空
$ct.html('<div class="btn"></div>')// 在$ct 里设置 html <div class="btn"></div>

//获取、设置$node 的宽度、高度(分别不包括内边距、包括内边距、包括边框、包括外边距)
//高度
$node.height()//不包括内边距
$node.innerHeight()//包括内边距
$node.outerHeight()//包括边框
$node.outerHeight(true);//包括外边距
//宽度
$node.width()//不包括内边距
$node.innerWidth()//包括内边距
$node.outerWidth()//包括边框
$node.outerWidth(true);//包括外边距           

$(window).scrollTop()// 获取窗口滚动条垂直滚动距离

// 获取$node 到根节点水平、垂直偏移距离
$node.offset().left
$node.offset().top

// 修改$node 的样式，字体颜色设置红色，字体大小设置14px
$node.css({
    'color':'red',
    'font-size':'14px'
})
// 遍历节点，把每个节点里面的文本内容重复一遍
$node.each(function(){
    console.log($this.text())
})

$ct.find('.item')// 从$ct 里查找 class 为 .item的子元素
$ct.children()// 获取$ct 里面的所有孩子
$node.parent('.ct').children('.panel')// 对于$node，向上找到 class 为'.ct'的父亲，在从该父亲找到'.panel'的孩子

$node.length// 获取选择元素的数量
$node.index()// 获取当前元素在兄弟中的排行

jQuery动画与ajax