jquery

题目1： jQuery 能做什么？

jQuery能选取并操作HTML元素，修改元素属性，CSS属性操作，监听事件并进行对应的操作，设置javascript动画，Ajax

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

JQuery对象包含更多的对象属性，DOM对象就是对应的元素
J->D: $('#id')[0]
D->J: $(document.querySelector('#id'))

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

jQuery使用一般使用.on绑定事件：
如：$('element').on('click',function(){})

.on( events [, selector ] [, data ], handler(eventObject) )

events
类型: String
一个或多个空格分隔的事件类型和可选的命名空间，或仅仅是命名空间，比如"click", "keydown.myPlugin", 或者 ".myPlugin"。

selector
类型: String
一个选择器字符串，用于过滤出被选中的元素中能触发事件的后代元素。如果选择器是 null
或者忽略了该选择器，那么被选中的元素总是能触发事件。

data
类型: Anything
当一个事件被触发时，要传递给事件处理函数的event.data
。

handler(eventObject)
类型: Function()
事件被触发时，执行的函数。若该函数只是要执行return false
的话，那么该参数位置可以直接简写成 false。

.bind():为一个元素绑定一个事件处理程序。
.unbind():从元素上删除一个以前附加事件处理程序。
.delegate():为所有匹配选择器（selector参数）的元素绑定一个处理器到一个或多个事件，现在或将来， 基于根元素的一个特定的组
.on():在选定的元素上绑定一个或多个事件处理函数。
.off():移除一个事件处理函数。
.live():附加一个事件处理器到符合目前选择器的所有元素匹配，现在和未来。

推荐使用.on代理事件写法：

$('#parent').on('click',$('.child'),function(){})

题目4：jQuery 如何展示/隐藏元素？

展示：.show()
隐藏: .hide()
展示/隐藏切换： .toggle()

题目5： jQuery 动画如何使用？

jQuery动画一般使用.animate()方法

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

properties
类型: PlainObject
一个CSS属性和值的对象,动画将根据这组对象移动。

duration (默认: 400
)
类型: Number or String
一个字符串或者数字决定动画将运行多久。（愚人码头注：默认值: "normal"， 三种预定速度的字符串("slow", "normal", 或 "fast")或表示动画时长的毫秒数值(如：1000) ）

easing (默认: swing
)
类型: String
一个字符串，表示过渡使用哪种缓动函数。（译者注：jQuery自身提供"linear" 和 "swing"）

complete
类型: Function()
在动画完成时执行的函数。

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

• 使用.html()来设置和获取内部HTML内容如：

考虑以下的HTML：
<div class="demo-container">
  <div class="demo-box">Demonstration Box</div>
</div>
获取内容
$('div.demo-container').html();
结果如下:
<div class="demo-box">Demonstration Box</div>
这种方法使用浏览器的innerHTML 属性。有些浏览器返回的结果可能不是原始文档的 HTML 源代码。例如，如果属性值只包含字母数字字符，Internet Explorer有时丢弃包裹属性值的引号。

设置内容
$('div.demo-container')
  .html('<p>All new content. <em>You bet!</em></p>');
这行代码将替换 <div class="demo-container">里的所有内容
结果：
<div class="demo-container">
  <p>All new content. <em>You bet!</em></p>
</div>

• 使用.text()来获取设置文本内容

<div class="demo-container">
  <div class="demo-box">Demonstration Box</div>
  <ul>
    <li>list item 1</li>
    <li>list <strong>item</strong> 2</li>
  </ul>
</div>
代码$('div.demo-container').text() 将提供下面的结果:
Demonstration Box list item 1 list item 2

$('div.demo-container').text('<p>This is a test.</p>');代码语句将输出以下 DOM :
<div class="demo-container">
<p>This is a test.</p>
</div>

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

$('selector').val():获取表单用户输入值;
$('selector').val('…'):设置输入值;

$('selector').attr('name'):获取元素属性;
$('selector').attr('name','xxx'):设置元素属性的值;

题目8：

link

题目9：

link

题目10：

link

题目11：

link