1. jQuery 能做什么？

jQuery 是一个轻量级的 JavaScript 库，它强调的理念是写得少，做得多（write less, do more），利用 jQuery 强大的选择器、链式操作、事件处理机制和完善的 Ajax ，我们可以更快捷的完成 JavaScript 任务

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

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

区别
- DOM 对象可以使用 JavaScript 中的方法，不能使用 jQuery 里的方法
- jQuery 对象是通过 jQuery 包装 DOM 对象后产生的对象，jQuery 无法使用 DOM 对象的任何方法，只能使用 jQuery 里的方法

相互转换

jQuery 对象转 DOM 对象：[index] 和 get(index)，示例如下：

//[index]
var $ct = $('#ct');
var ct = $ct[0];

//get(index)
var $ct = $('#ct');
var ct = $ct.get(0);

DOM 对象转 jQuery 对象：用 $() 把 DOM 对象包裹住可以了

var ct = document.getElementById('ct');
var $ct = $(ct);

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

jQuery 中有4种绑定事件的方式 bind、delegate、live、on，对应的解除绑定的方式为 unbind、undelegate、live、off。
bind() 可以用来给元素绑定一个或多个事件，bind() 的调用方式为 bind(type, data, fn)
- 第一个参数 type 为事件类型（blur, focus, load, click等）
- 第二个参数 data 为可选参数，通过event.data 属性值作为传入监听函数的参数
- 第三个参数 fn 是用来监听的处理函数
```
//简单用法
$('#ct .btn').bind('click.myClick',function () {
  $('#ct').prepend('<p>hello world</p>')
})
//解除绑定
$('#ct .btn').unbind('click.myClick')
```
delegate() 用于事件代理，为指定的元素（属于被选元素的子元素）添加一个或多个事件处理程序，并规定当这些事件发生时运行的函数；适用于当前或未来的元素（比如由脚本创建的新元素）。

$('ul').delegate('li', 'click', function() {
  var text = $(this).text();
  console.log(text);
})

live()：这种方法是将页面的document元素作为事件代理元素，太消耗资源，已经过时。在新版本中推荐用 on() 方法，即时在旧版本中，也推荐使用 delegate() 方法来取代 live() 方法。
on()：在选定的元素上绑定一个或多个事件处理函数，提供绑定事件处理的所有功能。注意：on() 的事件代理和 delegate 的事件代理，写法不一样，子元素和触发事件的位置不同


  //简单用法
  $('#ct .btn').on('click.myClick',function () {
    $('#ct').prepend('<p>hello world</p>')
  })
  
  //绑定事件代理
  $('ul').on('click', 'li', function() {
  var text = $(this).text();
  console.log(text);
  })
  
  //解除绑定
  $('#ct .btn').off('click.myClick')

推荐使用：on()方法，因为既能绑定普通事件，也能绑定事件代理。

  //绑定事件代理
  $('ul').on('click', 'li', function() {
  var text = $(this).text();
  console.log(text);
  })

4. jQuery 如何展示/隐藏元素？

show()方法和 hide() 方法(宽高同时延伸)

$('#ct').hide();
//可以添加一个时间参数，单位是毫秒
$('#ct').show(1000);

fadeIn() 和 fadeOut() 方法，淡入淡出效果

$('#ct').fadeIn();
//可以添加一个时间参数，单位是毫秒
$('#ct').fadeOut(3000);

slideUp() 和 sildeDown() 方法，由上到下延伸(宽度不变)

$('#ct').slideUp();
//可以添加一个时间参数，单位是毫秒
$('#ct').slideDown(3000);

5. jQuery 动画如何使用？

animate() 自定义动画方法，用法为animate(params, speed, callback)
- paras：一个包含样式属性及值的映射如{left: '500px', top: '300px'}
- speed：速度参数，可选
- callback：在动画完成时执行的函数，可选

$('#ct').on('click', function () {
  $(this).animate({left: '200px', top: '100px'}, 3000);

4个专门用于交互的动画方法
- toggle() ：切换元素的可见状态
```
$('#ct').on('click', function () {
 $(this).toggle();
});
```
- slideToggle()：通过高度变化来切换元素的可见性
```
$('#ct').on('click', function () {
 $(this).slideToggle(3000);
});
```
- fadeTo()：把元素的不透明度以渐进方式调整到指定的值
```
$('#ct').on('click', function () {
 $(this).fadeTo(1000, 0.2);
});
```
- fadeToggle()：通过不透明度的变化来切换元素的可见性
```
$('#ct').on('click', function () {
 $(this).fadeToggle(1000);
});
```

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

html()：设置和获取元素内部 HTML 内容

//获取
var ctHtml = $('#ct').html();
//设置
$('#ct').html('<p>hello world</p>');

text()：设置和获取元素内部文本

//获取
var pText = $('p').text();
//设置
$('p').text('hello world');

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

val()：设置和获取表单用户输入或者选择的内容

<input type="text" id="address" value="请输入地址">
//获取输入框的值
$('#address').val();
//设置输入框的值
$('#address').val('广州市xx区xx街道');

attr()：设置和获取元素属性

//获取
var ctId = $('.ct').attr('id');
//设置
$('.ct').attr('id', 'container');
$('.ct').attr('id' : 'container', 'name' : 'container');
//移除
$('.ct').removeAttr('id', 'name');