初识jQuery

题目1： 说说库和框架的区别？

库的英语为 Library ( 简写 Lib )，框架的英语为 Framework。

库是将代码集合成的一个产品，供程序员调用。面向对象的代码组织形式而成的库也叫类库。面向过程的代码组织形式而成的库也叫函数库。
在函数库中的可直接使用的函数叫库函数。开发者在使用库的时候，只需要使用库的一部分类或函数，然后继续实现自己的功能。

框架则是为解决一个(一类)问题而开发的产品，框架用户一般只需要使用框架提供的类或函数，即可实现全部功能。可以说，框架是库的升级版。
开发者在使用框架的时候，必须使用这个框架的全部代码。

框架和库的比较可以想像为:

假如我们要买一台电脑。框架为我们提供了已经装好的电脑，我们只要买回来就能用，但你必须把整个电脑买回来。这样用户自然轻松许多，但会导致
很多人用一样的电脑，或你想自定义某个部件将需要修改这个框架。而库就如自己组装的电脑。库为我们提供了很多部件，我们需要自己组装，如果某个部件
库未提供，我们也可以自己做。库的使用非常灵活，但没有框架方便。

题目2： jquery 能做什么？

封装部分JavaScript代码，API友好。

$(“css选择器”) 代替了 document.getElementsByTagName(“”)、document.getElementById(“”)…
$(“css选择器”).css(“color”,”red”) 代替了 document.getElementById(“”).style.color = “red”。
$(“css选择器”).text(“”) 一个api同时具有读跟写的功能。($(“div”).text(“你好吗”);)。
$(“css选择器”).on(“click”,function (){}),监听事件。

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

DOM原生对象：w3c标准用于操作文档的API.
jQuery对象：包装DOM对象产生的对象。
区别：DOM原生对象使用DOM原生对象的方法，jQuery对象使用jQuery对象的方法。
转化：
DOM原生对象转化为jQuery对象：$div = $(document.getElementsByTagName(‘div’));
jQuery对象转化为DOM原生对象：div = $div[index];

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

$(".className").on('eventType',function(){dosth...})//jquery通过on来绑定事件
bind和unbind是较早版本的jquery的语法，现在已经不推荐使用

$('.classname').bind('click',function(){
    console.log($(this).html())//在控制台打印点击元素的innerHTML值。
})
unbind是bind的反向操作
$('.classname').unbind()//取消绑定在选定元素的所有事件
$('.classname').unbind('click')//取消绑定在选定元素的单击事件
delegate，给选定元素的子元素绑定事件，使用 delegate() 方法的事件处理程
序适用于当前或未来的元素（比如由脚本创建的新元素）。
$('.parentname').delegate('.childname','click',function(){
    dosth...
})
.live()事件委托
.live() 方法能对一个还没有添加进DOM的元素有效，是由于使用了事件委托：
绑定在祖先元素上的事件处理函数可以对在后代上触发的事件作出回应。传递
给 .live() 的事件处理函数不会绑定在元素上，而是把他作为一个特殊的事件处
理函数，绑定在 DOM 树的根节点上
比如：
$('.classname').live('click',function(){
  dosth...
})
加入执行完以后，又有新的匹配.classname的元素添加进dom中的话，对其也会动态的绑定click事件
无论是bind和unbind还是delegate或者live，现在一次性全部可以通过.on()的方
式去实现，所以上述四个方法已经很少使用
.off()是.on()的反向操作，用来移除通过on绑定的事件

通过.on()绑定事件代理的写法是通过delegate变换而来

$('.classname').on('click','.childname',function(){//参数中多一个子元素就可以
  dosth...
})

题目5：jquery 如何展示/隐藏元素？

$('.classname').show(speed,callback)//展示选中的元素,speed可以控制元素从无到有的过度时间，callback是元素完全展示后的回调函数

$('.classname').hide(speed,callback)//隐藏选中的元素

题目6： jquery 动画如何使用？

语法：$(selector).animate({params},speed,callback);

jQuery动画

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

$('.classname').html()//不加参数即可获取内部html内容
$('.classname').html('我是改变后的html内容')//加参数即可设置内部html内容
$('.classname').text()//不加参数即可获取内部文本
$('.classname').text('我是改变后的文本内容')//加参数即可设置内部文本

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

$(selectorOfFormData).val()//不加参数即可获取用户输入或选择的内容
$(selectorOfFormData).val(modifiedVal)//加参数即可设置用户输入或选择的内容
$(selector).attr(attributeName)//传入元素属性名即可获取元素的属性值
$(selector).attr(attributeName,attributeVal)//传入元素属性名和要设置的属性值
即可完成对元素的属性设置

题目九

点我预览

题目十

点我预览

题目十一

点我预览