本教程版权归小圆和饥人谷所有，转载须说明来源

问答

1. 说说库和框架的区别？

库可以理解为若干功能的集合，要什么可以直接取；
框架更强调整体提供给使用者一种解决方案，而非简单的工具集的概念，框架可以提供相应的库或者基于库来实现，但库一般不会具备框架的规范性。

2. jquery 能做什么？

• 方便快捷获取DOM元素
• 动态修改页面样式
• 动态改变DOM内容
• 响应用户的交互操作
• 为页面添加动态效果
• 统一Ajax操作
• 简化常见的JavaScript任务

3. jquery 对象和 DOM 原生对象有什么区别？如何转化？

区别：JQuery对象就是通过jQuery包装DOM原生对象后产生的对象。JQuery对象是jQuery独有的，其可以使用jQuery里的方法，但是不能使用DOM的方法。

转化：
DOM原生对象一般可以通过 $() 转换成jquery对象：

$(document.getElementById("msg"));

由于jquery对象本身是一个集合。所以如果jquery对象要转换为dom对象则必须取出其中的某一项，一般可通过索引 [] 取出：

$("#msg")[0]，
$("div").eq(1)[0]，
$("div").get()[1]，
$("td")[5]

4. jquery中如何绑定事件？bind、unbind、delegate、live、on、off都有什么作用？推荐使用哪种？使用on绑定事件使用事件代理的写法？

bind() 向匹配元素附加一个或更多事件处理器

$('a').bind('click', function() { 
    alert('绑定事件');
});

unbind() 从匹配元素移除一个被添加的事件处理器

$('a').unbind('click',function(){
    alert('移除事件');
});

delegate() 向匹配元素的当前或未来的子元素附加一个或多个事件处理器

$('container').delegate('a','click',function(){
    alert('子元素绑定事件');
});

live():任何时候只要有事件冒泡到document节点上，它就查看该事件是否是一个click事件，以及该事件的目标元素与’a’这一CSS选择器是否匹配，如果都是的话，则执行函数

$('a').live('click', function() { 
    alert('查询冒泡事件');
});

on() live方法被废弃,on事件绑定把上面三种方法统一了，用起来更方便

// Bind
$( "#members li a" ).on( "click", function( e ) {} ); 
$( "#members li a" ).bind( "click", function( e ) {} ); 

// Delegate
$( "#members" ).on( "click", "li a", function( e ) {} ); //注意子元素参数位置
$( "#members" ).delegate( "li a", "click", function( e ) {} );

5. jquery 如何展示/隐藏元素？

//隐藏元素
$(selector).hide(speed,callback);
//展示元素
$(selector).show(speed,callback);

可选的 speed 参数规定隐藏/显示的速度，可以取以下值："slow"、"fast" 或毫秒。
可选的 callback 参数是隐藏或显示完成后所执行的函数名称。

6. jquery 动画如何使用？

jQuery animate() 方法用于创建自定义动画。

$(selector).animate({params},speed,callback);

必需的 params 参数定义形成动画的 CSS 属性。
可选的 speed 参数规定效果的时长。它可以取以下值："slow"、"fast" 或毫秒。
可选的 callback 参数是动画完成后所执行的函数名称。

7. 如何设置和获取元素内部 HTML 内容？如何设置和获取元素内部文本？

html() 设置或返回所选元素的内容（包括 HTML 标记）
text() 设置或返回所选元素的文本内容

8. 如何设置和获取表单用户输入或者选择的内容？如何设置和获取元素属性？

val() 设置或返回表单字段的值
attr() 设置或返回元素的属性