2025年HTML+CSS+javascript+jQuery面试题(31)_原创精品文档.pdf
非淡泊无以明志,非宁静无以致远。——诸葛亮
老当益壮,宁移白首之心;穷且益坚,不坠青云之志。——唐·王勃
HTML+CSS+javascript+jQuery⾯试题(31)
1、$()是什么?
$符号是jQuery框架对外暴露的全局变量,是window对象的属性
$()代表jQuery核⼼函数,可接收⼀个函数、字符串、DOM元素。
$(function(){});//推荐.接收字符串选择器
//3.接收DOM元素,该元素被包装成⼀个jQuery对象返回
2、JavaScriptwindow.onload事件和jQueryready函数的不同
原⽣js和jQuery⼊⼝函数的加载模式不同。原⽣js会等⽹页全部加载完毕(DOM元素、图⽚等)才会执⾏;多个window.onload只会执⾏
⼀次,后⾯覆盖前⾯。jQuery只等待⽹页中的DOM结构加载完毕,不等图⽚加载就会执⾏;多个$(document).ready()依次执⾏,不会覆
盖。
3、jQuery事件委托⽅法bind、live、delegate、on之间的区别
jQuery中提供了四种事件监听⽅式,分别是bind、live、delegate、on,对应的解除监听的函数分别是unbind、die、undelegate、off。
1,bind
bind()向匹配元素添加⼀个或多个事件处理器。
$(selector).bind(event,data,function)
bind是使⽤频率较⾼的⼀种,作⽤就是在选择到的元素上绑定特定事件类型的监听函数,参数的含义如下:
event:事件类型,如click、change、mouseover等;
data:传⼊监听函数的参数,通过event.data取到。可选;
function:监听函数,可传⼊event对象,这⾥的event是jQuery封装的event对象,与原⽣的event对象有区别,使⽤时需要注意。
bind的特点就是会把监听器绑定到⽬标元素上,有⼀个绑⼀个,在页⾯上的元素不会动态添加的时候使⽤它没什么问题。
解除绑定时只需要调⽤unbind⽅法即可
$(selector).unbind(event);
注意:绑定和解绑传⼊的对象和事件类型⼀定要⼀致。
优点:这个⽅法提供了⼀种在各种浏览器之间对事件处理的兼容性解决⽅案
⾮常⽅便简单的绑定事件到元素上
.click(),.hover()…这些⾮常⽅便的事件绑定,都是bind的⼀种简化处理⽅式
对于利⽤ID选出来的元素是⾮常好的,不仅仅是很快的可以hook上去(因为⼀个页⾯只有⼀个id),⽽且当事件发⽣时,handler可以⽴即被执
⾏(相对于后⾯的live,delegate)实现⽅式
缺点:它会绑定事件到所有的选出来的元素上
它不会绑定到在它执⾏完后动态添加的那些元素上
当元素很多时,会出现效率问题
当页⾯加载完的时候,你才可以进⾏bind(),所以可能产⽣效率问题
先天下之忧而忧,后天下之乐而乐。——范仲淹
百川东到海,何时复西归?少壮不尽力,老大徒伤悲。——汉乐府《长歌行》
不飞则已,一飞冲天;不鸣则已,一鸣惊人。——《韩非子》
2,live
live()向当前或未来的匹配元素添加⼀个或多个事件处理器;
$(selector).live(event,data,function);
event:事件类型,如click、change、mouseover等;
data:可选;需要传递的参数
function:监听函数,可传⼊event对象,这⾥的event是jQuery封装的event对象
但live和bind的区别在于:
live⽅法并没有将监听器绑定到⾃⼰(this)⾝上,⽽是绑定到了this.context上了。live正是利⽤了事件委托机制来完成事件的监听处理,把
节点的处理委托给了document。使⽤事件委托的优点⼀⽬了然,新添加的元素不必再绑定⼀次监听器。
另外:
live还可以多事件处理,如下:
$(selector).live({event1:function,event2:function,…});
多个事件和函数之间⽤分号隔开,可给同意对象绑定多个事件。
解除绑定时只需要调⽤unbind⽅法即可
$(selector).die(event);
注意:绑定和解绑传⼊的对象和事件类型⼀定要⼀致。
优点:这⾥仅有⼀次的事件绑定,绑定到document上⽽不像.bind()那样给所有的元素挨个绑定
那些动态添加的elemtns依然可以触发那些早先绑定的事件,因为事件真正的绑定是在do