jQuery选择器_DOM操作_样式_事件处理_动画

2017-10-17 本文已影响0人 Lucien_d70a

题目1： jQuery 能做什么？

JQuery 是个JS库，一些效果JS要用繁重的代码才能实现，但可以通过jQ一些封装好的方法方便快捷，简单明确的就能实现。jQ缺点是，代码是很多是意大利面条式，修改困难。

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

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

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

bin():为一个元素绑定一个或多个事件。

$('button').bind(‘click’,function(){console.log(this)});
$(‘p’).bind(‘mouseenter mouseleave’,function(){$(this).toggleClass(‘change’)})；

unbind:为一个元素解绑事件；

unbind():$(‘p’)解除该元素绑定的事件。

delegate：delegate() 方法为指定的元素（属于被选元素的子元素）添加一个或
多个事件处理程序，并规定当这些事件发生时运行的函数。
使用 delegate() 方法的事件处理程序适用于当前或未来的元
（比如由脚本创建的新元素）

//点击时切换隐藏显示状态
$("div").delegate("button","click",function(){
  $("p").slideToggle();
});

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

$(selector).on('事件.(这里可以写个标记)'，被代理的子元素，function(){
//代码
})
//事件代理的写法
$('ul').on('click.ul1'，'li'，function(){
//代码
})

off():用来移除on绑定的事件处理函数。

$(selector).off('事件.(可以写入on的标记来指定清除)')

$('ul').off('click.ul1')

推荐使用，on和off

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

方法	效果
.show(可以添加毫秒数，元素会慢慢出现)	出现
.hide(可以添加毫秒数，元素会慢慢隐藏)	消失
.fadeIn(index)	透明度慢慢变高出现
.fadeOut(index)	透明度慢慢变为0
.slideDown(index)	高度慢慢向下出现
.slideUp(index)	高度慢慢向上变为0消失；

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

animate({"你要改变的属性(要改变颜色，要引入JQ的其他ui库，)":"改变的值"}，毫秒数，function(){回掉函数，动画结束后你要干什么})

$('div').animate({width:"200px"},1000,function(){
            console.log('变化完毕')
})