---

keywords: jQuery、DOM、事件。

---

• 说说库和框架的区别？

库：重复使用的方法的集合，是对某些功能模块的封装，提供一个简单的接口；
框架：框架，即预定义的模板，我们只能在里面填充内容，能简化复杂的耦合关系；如果选择了某个框架，就要遵循这个框架的规则。

• jquery 能做什么？

操作文档对象、选择DOM元素、事件处理、制作动画效果、修改css、使用Ajax等等。

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

区别：jQuery对象只能使用jQuery方法，DOM原生对象只能使用JS方法

转化：
jQuery转原生：对jquery对象，使用数组下标获取；
原生转jQuery：

var abc = document.getElementById('header')
$(abd)

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

绑定事件：

$('button').click(function() {
    alert(1)
})

$("button").bind('click').function(e) {
    cosole.log(e)
    alert(2)
}

$("button").on('click',function() {
    console.log(e)
    console.log(this)
    console.log($(this))
})

.bind()：为一个元素绑定事件处理程序。

.unbind()：从元素上删除一个以前附加的事件处理程序。

.delegate()：为所有匹配选择器的元素绑定一个或多个事件处理函数，基于一个指定的根元素的子集，匹配的元素包括那些目前已经匹配到的元素，也包括那些今后可能匹配到的元素。在jQuery1.7以前，它是事件代理最有效的方式。

.live()：附加一个事件处理器到匹配目前选择器的所有元素，现在和未来。从jQuery1.7开始，.live()方法已过时。

.on()：在选定的元素上绑定一个或多个事件处理函数。从jquery1.7版本以后，.on()方法是事件代理的最好方法。

var $btn = $('#btn)
$btn.on('click',function() {
console.log('1')
})

.off()：移除一个事件处理函数。

• jquery 如何展示/隐藏元素？

.show()：显示匹配的元素,有3个可选参数：动画持续时间、easing、回调函数；

.hide()：隐藏匹配的元素,有3个可选参数：动画持续时间、easing、回调函数；

.toggle()：显示或隐藏匹配元素，有3个可选参数：动画持续时间、easing、完成后执行的回调函数。如果元素是最初显示，它会被隐藏，如果隐藏的，它会显示出来。

• jquery 动画如何使用？

.animate()：根据一组CSS属性，执行自定义动画。
用法：

.animate(properties[,duration][,easing][,complete])

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

.html()：获取集合中第一个匹配元素的HTML内容 或 设置每一个匹配元素的html内容。

.text()：得到匹配元素集合中每个元素的文本内容结合，包括他们的后代，或设置匹配元素集合中每个元素的文本内容为指定的文本内容。

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

.val()：获取匹配的元素集合中第一个元素的当前值或设置匹配的元素集合中每个元素的值。.val()方法主要用于获取或设置表单元素的值，比如 input, select 和 textarea。

.attr()：获取匹配的元素集合中的第一个元素的属性的值 或 设置每一个匹配元素的一个或多个属性。

代码

• 使用 jquery实现如下效果

效果+代码

• 使用 jquery实现如下效果

效果+代码
问题： 点奢侈品2的时候页面跳到了顶部，可能是什么原因？如何解决
a链接用#锚定了位置，当没有id时，默认跳到页面顶部。
解决办法：可以在阻止a的默认点击事件或者改用javascript:void 0

• 实现如下效果

效果+代码