题目1： jQuery 中， $(document).ready()是什么意思？
当ＤＯＭ元素加载完之后执行．以下三种方法等价：
$(document).ready(handler)
$().ready(handler) (this is not recommended)
$(handler)
题目2： $node.html()和$node.text()的区别?
$node.html()获取的是匹配元素集合中第一个元素的ＨＴＭＬ内容
$node.text()获取的是匹配元素集合中每个元素的文本内容
题目3： $.extend 的作用和用法?
将两个或更多对象的内容合并到第一个对象。
var object = $.extend({}, object1, object2);//object1和object2内容合并到空对象中，然后赋值给object
$.extend(object1, object2);//将object1和object2合并到object1中,object1改变
var defaults = { validate: false, limit: 5, name: "foo" };
var options = { validate: true, name: "bar" };
var settings = $.extend({}, defaults, options);
console.log(settings)// {validate: true, limit: 5, name: "bar"}
题目4： jQuery 的链式调用是什么？
使用jQuery方法后返回的是对象本身，然后就可以继续对这个对象使用其他jQuery方法。链式调用的优点是代码简洁易读，减少了多次重复使用同一个变量。举例:
$(‘#id’).show().hide().show().hide().show().hide();
题目5： jQuery 中 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 ] }
题目6：
写出以下功能对应的 jQuery 方法：
$node.addClass('active')//给元素 $node 添加 class active
$node.removeClass('active')//给元素 $noed 删除 class active
$node.show().hide()//展示元素$node, 隐藏元素$node
$node.attr('id')
$node.attr('src')
$node.attr('title')
$node.attr({
id: 'xxx',
src: 'xxx',
title: 'xxx'})//获取元素$node 的 属性: id、src、title， 修改以上属性
$node.data('src','xxxx')//给$node 添加自定义属性data-src
$ct.prepend(node)//在$ct 内部最开头添加元素$node
$ct.append(node)// $node在$ct 内部最末尾添加元素$node
$node.remove()//删除$node
$ct.empty()//把$ct里内容清空
$ct.html('<div class="btn"></div>')//在$ct 里设置 html <div class="btn"></div>
$node.width()//包括content
$node.height()
$node.innerWidth()//包括padding和content
$node.innerHeight()
$node.outerWidth()//包括border和padding和content
$node.outerHeight()
$node.outerWidth(true)//包括margin.border和padding和content
$node.outerHeight(true)//获取、设置$node 的宽度、高度(分别不包括内边距、包括内边距、包括边框、包括外边距)
$(window).scrollTop()//获取窗口滚动条垂直滚动距离
$node.offset().left
$node.offset().top//获取$node 到根节点水平、垂直偏移距离
$node.css({'color': 'red','font-size':'14px'})//修改$node 的样式，字体颜色设置红色，字体大小设置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()//获取当前元素在兄弟中的排行
题目7：
$('button').on('click',function () {
$btn.css('background','red').css('background','blue')//当点击$btn 时，让 $btn 的背景色变为红色再变为蓝色
})
$('window').on('scroll',function(){
consloe.log($('window').scrollTop())
})//当窗口滚动时，获取垂直滚动距离
$('button').on('mouseenter',function () {
$('button').css('background','red')
})
$('button').on('mouseout',function () {
$('button').css('background','#fff')
})//当鼠标放置到$div 上，把$div 背景色改为红色，移出鼠标背景色变为白色
$('input').on('focus',function () {
$('input').css('border','1px solid blue')
})
$('input').on('change',function () {
$('input').val($('input').val().toUpperCase())
})
$('input').on('blur',function () {
$('input').css('border','')
console.log($('input').val())
})
//当鼠标激活 input 输入框时让输入框边框变为蓝色，当输入框内容改变时把输入框里的文字小写变为大写，当输入框失去焦点时去掉边框蓝色，控制台展示输入框里的文字
$('select').on('change',function(){
var str = ''
$('select option:selected').each(function () {
str +=$(this).text() + ''
})
$('p').text(str)
})
//当选择 select 后，获取用户选择的内容
