- 说说库和框架的区别？
- 库（library）
就像一套把jacascript重新提取包装的工具包，提供许多工具来简化编写代码的过程，例如'jQuery'、'MooTools'、'YUI' - 框架（framework）
规定了你的代码应该按照怎样的结构来呈现，就像一套代码模板，然后解决特定的问题，例如'Backbone'、'requireJS'、'socketIO'
- 库（library）
- jquery 能做什么？
- 提供友好的API，例如，DOM的操作和获取都是一个API，不传参数是获取，传了参数是操作，对开发人员十分便利
- 支持链式操作，例如，
$('#id').addClass('cls').removeClass('cls')，特别方便 - 提供操作简单的动画效果
- jquery 对象和 DOM 原生对象有什么区别？如何转化？
- jQuery对象
jQuery对象是一个伪数组，可以支持jQuery的操作，但是不可以使用DOM的操作，可以用两种方法转化成DOM对象，一种是$('div')[0]，另一种是'$('div').get(0)' - DOM对象
DOM对象只能使用DOM提供的方法，不能使用jQuery的操作，可以直接把DOM对象传入'$(node)'来转化成jQuery对象
- jQuery对象
- jquery中如何绑定事件？bind、unbind、delegate、live、on、off都有什么作用？推荐使用哪种？使用on绑定事件使用事件代理的写法？
- jquery中如何绑定事件？
这是jQuery事件绑定的语法
- jquery中如何绑定事件？
.on( events [, selector ] [, data ], handler(eventObject) )
例如，
$('#btn').on('click',function(event){
alert('hello')
})
- bind、unbind、delegate、live、on、off都有什么作用？推荐使用哪种？
- bind，为元素绑定一个事件处理程序
- unbind，从元素上删除一个以前附加事件处理程序
不传参数的话会移除元素上所有的事件处理程序
$('#btn').unbind()
为了更好的控制最好传入参数，如
var handler = function(){
alert('hello')
}
$('#btn').bind('click',handler)
$('#btn').unbind('click',handler)
- delegate，为匹配选择器的元素绑定一个或多个事件处理函数，常用来绑定事件代理（委托）
语法，其中selector为绑定事件的元素
.delegate( selector, eventType, handler(eventObject) )
- live，附加一个事件处理函数到匹配目前选择器的所有元素，包括现在和未来，意味着动态绑定事件处理函数
- on，在选定的元素上绑定一个或多个事件处理程序
- off，移除用on绑定的事件处理函数
- 推荐使用哪种？
在jQuery1.7以后都推荐使用on
- 使用on绑定事件使用事件代理的写法？
下面的例子用事件代理的方式为ul绑定了事件处理程序，当触发元素为li的时候才触发事件处理程序
$('ul').on('click','li',function(){
alert('hello')
})
- jquery 如何展示/隐藏元素？
- 第一种，jQuery会自动保存元素的dislay属性，如果原来为inline的元素再次显示后还是为inline
$('div').show()
$('div').hide()
- 第二种
$('div').css('display','block')
$('div').css('display','none')
- jquery 动画如何使用？
除了内置的淡入淡出和滑动的动画效果，jQuery还支持自定义的动画，使用animate()方法，使用animate方法需要注意html元素的位置都是静态的。如果需要对位置进行操作，需要先把position属性设置不为static
//语法
$(selector).animate({params},speed,callback)
- params参数是必须的，定义形成动画的css属性
$(selector).animate({
left: '200px',
opacity: '0.5',
height: '150px',
width: '150px'
})
- speed参数是可选的，规定效果时长，可以是'slow'、'fast'和毫秒数
- callback参数是可选的，表示动画完成后执行的函数名称
- 如何设置和获取元素内部 HTML 内容？如何设置和获取元素内部文本？
- 设置和获取元素内部 HTML 内容
- 获取HTML内容
.html()用来获取元素的HTML内容，如果有匹配到多个元素，只获取第一个元素的HMTL内容 - 设置HTML内容
如果匹配到多个元素，会修改所以匹配到的元素的HTML内容，'.html(htmlString)'或者'.html(function(index,oldhtml))'，两种用法，第一个可以传入一个html字符串，例如
- 获取HTML内容
- 设置和获取元素内部 HTML 内容
$('div').html('hello
')
第二种，可以传入一个函数，函数的返回值为设置的html内容，函数有两个参数，一个是当前元素在所选元素里面的索引，一个是要被修改的html内容，例如
$('div').html(function(index,oldhtml){
return 'index: '+index+'oldhtml: '+oldhtml
})
- 设置和获取元素内部文本
- 获取文本内容
'.text()'可以获取元素的内部文本，注意，'.text()'获取的不是匹配到的第一个元素的文本内容，而是所有匹配到元素的文本内容，相当于DOM的innerText属性
- 设置文本内容
设置文本的内容和设置HTML内容是一样的，有两种方式，第一种直接传入文本，例如
$('p').text('hello')
第二种传入一个函数，函数有两个参数
$('p').text(function(index.oldtext){
return '索引: '+index+' 以前的: '+oldtext
})
- 如何设置和获取表单用户输入或者选择的内容？如何设置和获取元素属性？
- 设置和获取表单用户输入或者选择的内容
- 获取表单内容
'.val()'，对于输入框，只要用户输入了内容，就可以通过'.val()'来获取，对于单选框和复选框。'.val()'可以获取设置的value - 设置表单内容
对于设置输入框的内容和'.text()'和'.html()'的设置方法一样，但是对于单选框、多选框和选择框，可以传递一个数组作为参数，匹配到这个数组项的将被选中，例如
- 获取表单内容
- 设置和获取表单用户输入或者选择的内容
//这是修改单一选项的值
$("#single").val("Single2");
//这是修改multiple select的值，匹配到数值的value的选项会被选中
$("#multiple").val(["Multiple2", "Multiple3"]);
//这是修改input单选框和多选框的值，如果value与数组的值匹配将会被选中
$("input").val(["check1","check2", "radio1" ]);
- 如何设置和获取元素属性
- `.attr(attributeName)`可以用来获取元素的属性
- 设置元素属性的时候有三种用法
1. `.attr( attributeName, value )`
直接设置value就是要设置的属性值
2. '.attr( attributes )'
可以传进去一个对象，对象用key:value的形式设置多个属性的值，例如
$( "img" ).attr({
src: "/resources/hat.gif",
title: "jQuery",
alt: "jQuery Logo"
});
3. '.attr( attributeName, function(index, attr) )'
函数接受的参数分别是元素在集合中的索引和原来attrbuteName的值