1.说说库和框架的区别？
- 库：库里面有很多方法，当你需要时就可以到库里面拿去调用。
- 框架：就是一个模型，相当于一个空壳，里面没有内容，需要你自己往框架里面填充东西。
2.jquery 能做什么？
- 获取HTML元素
- 操作HTML元素
- 操作CSS
- 为页面添加动态效果
- 简化常见的JavaScript任务
- 统一AJAX操作
3.jquery 对象和 DOM 原生对象有什么区别？如何转化？
- 区别：jquery无法使用DOM对象的任何方法，同理DOM对象也不能使用jQuery里的方法。
- 转化：
jquery 对象转化成DOM 对象：
var $a = $("#header");
var a = $a[0];
DOM 对象转化成jquery 对象：
var a = document.getElementById("header");
var $a = $(a);
4.jquery中如何绑定事件？bind、unbind、delegate、live、on、off都有什么作用？推荐使用哪种？使用on绑定事件使用事件代理的写法？
- 事件绑定：
$('button').on('click', function(){
console.log($(this));
});
(1)bind()向匹配元素添加一个或多个事件处理器，绑定单个事件的使用方法：
$(selector).bind(event,data,function(){});
(2)live:向当前或未来的匹配元素添加一个或多个事件处理器，绑定单个事件的使用方法：
$(selector).live(event,data,function(){});
(3)delegate:为指定的元素（被选元素的子元素）添加一个或多个事件处理程序，并规定当这些事件发生时运行的函数。使用 delegate() 方法的事件处理程序适用于当前或未来的元素（比如由脚本创建的新元素）。
$(selector).delegate(childSelector,event,data,function(){});
(4)on:其实是将以前的绑定事件方法作了统一
$("div").on("click", "p", function(){
alert($(this).text());
});
- 推荐使用on()
- 使用on绑定事件使用事件代理:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jquery</title>
<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.js"></script>
</head>
<body>
<div id="header">头部</div>
<div class="ct">
<div class="inner">inner1</div>
<div class="inner">inner2</div>
<div class="inner">inner3</div>
</div>
<button class="btn1">添加最后</button>
<button class="btn2">添加最前</button>
<script>
$('.btn1').on('click', function(){
$('.ct').append('<div class="inner">inner...</div>');
});
$('.btn2').on('click', function(){
$('.ct').prepend('<div class="inner">inner...</div>');
});
</script>
</body>
</html>
5.jquery 如何展示/隐藏元素？
- 展示：
$(".btn1").on("click", function(){
$("#ct").show();
});
- 隐藏：
$(".btn2").on("click", function(){
$("#ct").hide();
});
6.jquery 动画如何使用？
$(".btn").on("click", function(){
$("#ct").animate({width: 100px});
});
7.如何设置和获取元素内部 HTML 内容？如何设置和获取元素内部文本？
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jquery</title>
<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.js"></script>
</head>
<body>
<div id="header">头部</div>
</body>
</html>
结果
8.如何设置和获取表单用户输入或者选择的内容？如何设置和获取元素属性？
使用.val() （括号里不包含任何参数）来获取表单用户输入或者选择的内容；当.val()括号里面有值时则是设置匹配的元素集合中每个元素的值。
使用.atrr() （括号里为属性名时）可获取元素的属性；
获取元素属性
举例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jquery</title>
<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.js"></script>
</head>
<body>
<div id="header">头部</div>
<script>
console.log($('#ct-img').attr('src'));
</script>
</body>
</html>
运行结果
设置元素属性
举例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jquery</title>
<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.js"></script>
</head>
<body>
<div id="header">头部</div>
<a href="http://www.jirengu.com">链接</a>
<script>
console.log($('#ct-img').attr('src'));
</script>
</body>
</html>
结果
