1.jQuery 中， $(document).ready()是什么意思？
$(document).ready()是当文档中的DOM节点加载完成后，在加载外部图片和资源前，执行ready()里面的操作。可以简写成
$(function(){
})
window.onload是整个页面加载完成（包括图片、CSS、脚本等）后，执行onload()中的操作。
2.$node.html()和$node.text()的区别?
$node.html()，返回所选择元素内的html内容，包含html标签和文本内容
$node.text()，返回所选择元素内的文本内容，不包含html标签，只包含文本内容
括号内带参数，则为设置内容
3.$.extend 的作用和用法?
$.extend()将多个对象合并到一起，可以传入多个参数。$.extend([deep,] target,…)[deep,]为布尔值默认情况不是深拷贝，可设置true为深拷贝。
//定义一个对象
var obj={
name:'Clark',
age:27,
sex:'male'
};
//定义一个新对象
var newObj={
name:'xuyangjie',
age:21
};
//extend方法接受多个参数,在属性相同的情况下，会把第一个对象的属性覆盖
$.extend(obj,newObj,{
name:'lili',
age:25,
hobby:"sleep"
});
console.log(obj);
object{
name:"lili"
age:25,
sex:"male"
hobby:"sleep"
}
4.jQuery 的链式调用是什么？
当jQuery的方法的返回值仍为当前对象时可以继续调用该对象的方法，这样就形成一种链式调用。
$(#ct).css('color','blue').show(400).hide();
5. jQuery 中 data 函数的作用
第一种用法：
.data(key,value)：在匹配元素上存储任意相关数据
$("div").data("people",{age:30,sex:"男"});
console.log( $("div").data("people").sex ); //男
第二种用法：
.data(key):返回匹配元素集合中的第一个元素给定成名的数据存储的值，通过.data(name,value)或HTML 5 data-*属性（着重）的设置。
<div data-role="page" data-last-value="43" data-hidden="true" ></div>
下面通过data()函数获取里面的值
$("div").data("role") // "page";
$("div").data("lastValue")//43;
上代码的第二条语句正确是表述了该元素的data-last-value属性。 如果没有传递key参数的数据存储， jQuery将在元素的属性中搜索， 将驼峰式字符串转化为中横线字符串，然后在结果前面加上data-。 所以，该字符串lastValue将被转换为data-last-value。
6.写出以下功能对应的 jQuery 方法：
1.给元素 $node 添加 class active，给元素 $noed 删除 class active
$node.addClass("active");
$node.removeClass("active")
2.展示元素$node, 隐藏元素$node
$node.show();
$node.hide();
3.获取元素$node 的 属性: id、src、title， 修改以上属性
$node.attr("id");
$node.attr("src");
$node.attr("title");
$node.attr("id","node");
$node.attr("src","jquery-3.1.1.js");
$node.attr("id","jquery");
4.给$node 添加自定义属性data-src
$node.data("src",str)
5.在$ct 内部最开头添加元素$node
$cr.prepend($node)
6.在$ct 内部最末尾添加元素$node
$cr.append($node)
7.删除$node
$node.remove()
8.把$ct里内容清空
$.ct.empty()
9.在$ct 里设置 html <div class="btn"></div>
$ct.html("<div class="btn"></div>")
10.获取、设置$node 的宽度、高度(分别不包括内边距、包括内边距、包括边框、包括外边距)
$node.width();//不包括内边距宽度,仅包括内容
$node.height();//不包括内边距高度,仅包括内容
$node.innerWidth();//包括内容和内边距宽度
$node.innerHeight();//包括内容和内边距高度
$node.outerWidth();//包括内容,内边距,边框宽度
$node.outerHeight();//包括内容,内边距,边框高度
$node.outerHeight(true);//包括内容,内边距,边框,外边距高度
$node.outerWidth(true);//包括内容,内边距,边框,外边距宽度
11.获取窗口滚动条垂直滚动距离
$(window).scrollTop()
12.获取$node 到根节点水平、垂直偏移距离
$node.offset()
13.修改$node 的样式，字体颜色设置红色，字体大小设置14px
$node.css({"color":"red","font-size":"14px"})
14.遍历节点，把每个节点里面的文本内容重复一遍
$.each($node,function(){console.log($(this).text())})
15.从$ct 里查找 class 为 .item的子元素
$ct.find(".item");
16.获取$ct 里面的所有孩子
$ct.children()
17.对于$node，向上找到 class 为'.ct'的父亲，在从该父亲找到'.panel'的孩子
$node.parents(".ct").find(".panel")
18.获取选择元素的数量
$('li').length
19.获取当前元素在兄弟中的排行
$(this).index()
7.用jQuery实现以下操作
- 当点击$btn 时，让 $btn 的背景色变为红色再变为蓝色
- 当窗口滚动时，获取垂直滚动距离
- 当鼠标放置到$div 上，把$div 背景色改为红色，移出鼠标背景色变为白色
- 当鼠标激活 input 输入框时让输入框边框变为蓝色，当输入框内容改变时把输入
- 框里的文字小写变为大写，当输入框失去焦点时去掉边框蓝色，控制台展示输入框里的文字
- 当选择 select 后，获取用户选择的内容
demo
8.用 jQuery ajax 实现如下效果。`当点击加载更多会加载数据展示到页面
服务端数据mock成功
代码地址
