jquery经典面试题

本文整理了jQuery的面试题及答案,涵盖了jQuery的美元符号$的作用、onload()与document.ready()的区别、jQuery的选择器类型、边框样式设置、CDN不可用时的解决方法、创建对话框、Delegate()函数用法、URL编码与解码、禁用浏览器前进后退按钮等关键知识点。
jQuery是一款非常流行的Javascript框架,如果你想要从事Web前端开发这个岗位,那么jQuery是你必须掌握而且能够熟练应用的一门技术。本文整理了一些关于jQuery的经典面试题及答案,分享给正要面试Web开发岗位的同学。问题:jQuery的美元符号$有什么作用?回答:其实美元符号$只是”jQuery”的别名,它是jQuery的选择器,如下代码:$(document).ready(function(){});当然你也可以用jQuery来代替$,如下代码:jQuery(document).ready(function(){});jQuery中就是通过这个美元符号来实现各种灵活的DOM元素选择的,例如$(“#main”)即选中id为main的元素。问题:body中的onload()函数和jQuery中的document.ready()有什么区别?回答:onload()和document.ready()的区别有以下两点:1、我们可以在页面中使用多个document.ready(),但只能使用一次onload()。2、document.ready()函数在页面DOM元素加载完以后就会被调用,而onload()函数则要在所有的关联资源(包括图像、音频)加载完毕后才会调用。问题:jQuery中有哪几种类型的选择器?回答:从我自己的角度来讲,可以有3种类型的选择器,如下:1、基本选择器:直接根据id、css类名、元素名返回匹配的dom元素。2、层次选择器:也叫做路径选择器,可以根据路径层次来选择相应的DOM元素。3、过滤选择器:在前面的基础上过滤相关条件,得到匹配的dom元素。问题:请使用jQuery将页面上的所有元素边框设置为2px宽的虚线?回答:这正是jQuery选择器上场的时候了,代码如下:问题:当CDN上的jQuery文件不可用时,该怎么办?回答:为了节省带宽和脚本引用的稳定性,我们会使用CDN上的jQuery文件,例如google的jquery cdn服务。但是如果这些CDN上的jQuery服务不可用,我们还可以通过以下代码来切换到本地服务器的jQuery版本:问题:如何使用jQuery实现点击按钮弹出一个对话框?回答:代码如下:HTML:jQuery:问题:jQuery中的Delegate()函数有什么作用?回答:delegate()会在以下两个情况下使用到:1、如果你有一个父元素,需要给其下的子元素添加事件,这时你可以使用delegate()了,代码如下:$("ul").delegate("li", "click", function(){$(this).hide();});2、当元素在当前页面中不可用时,可以使用delegate()问题:怎样用jQuery编码和解码URL?回答:在jQuery中,我们可以使用以下方法实现URL的编码和解码。encodeURIComponent(url) and decodeURIComponent(url)问题:如何用jQuery禁用浏览器的前进后退按钮?回答:实现代码如下:
(答案见下载资源) 上机任务1 用chrome打开dom.sample2.html页面, 在chrome的控制台中输入jQuery代码并执行,完成以下选择动作: (1)查找id号为tigerLily的元素 (2)查找拥有类myList的元素 (3)查找所有的input元素 (4)查找所有img元素和tr元素 (5)查找id号为coffeePot和id号为someDiv的元素 (6)选择具有id属性的所有元素 (7)选择具有id属性的input元素 (8)选择其value属性等于A的元素 (9)选择其value属性等于A或等于C的元素 (10)选择其title属性值中含有dog的img元素 (11)选择其href属性值以http开头的a元素 (12)选择div元素内嵌套的span元素 上机任务2 用chrome打开dom.sample2.html页面, 在chrome的控制台中输入jQuery代码并执行,完成以下选择动作: (13)选择元素li,该元素作为拥有myList类的ul元素的直接子元素 (14)选择id号为radioA的input元素后面的第一个input兄弟元素 (15)选择id号为radioA的input元素后面的所有input兄弟元素 (16)选择dom sample页面中第3个tr元素 (17)选择其type属性值checkbox且索引为偶数的input元素 (18)选择非最后一行的tr元素 (19)选择所有的checkbox元素 (20)选择所有被选中的表单元素 (21)选择含有1972的td元素 (22)选择包含有sapn元素的div元素 (23)选择表格中每行的第一个单元格和最后一个单元格 (24)选择表格中第3行,标题行不算(要求用nth-child()过滤器) 上机任务3 用chrome打开dom.sample2.html页面,该页面中内嵌有几个CSS类:.red .green .blue .yellow .thickBorder .seeThrough 在chrome的控制台中输入jQuery代码并执行,完成以下选择动作: (1)将拥有alt属性的倒数第二个图片元素应用yellow类 (2)将第一个checkbox表单元素应用.green样式 (3)求id值为checkbox3的元素在所有表单元素里的顺序号 (4)用一条链式语句完成:先对所有img元素应用seeThrough样式,再为所有img元素和tr元素应用yellow样式 (5)用filter方法实现:选择单元格内容为Java或Smalltalk的单元格 (6)取图片集中的第2,3,4张图片 (7)用has方法实现:选择那些包含有ul元素的li元素 (8)将tbody每个单元格里的文字设为:我爱jQuery (9)查找form元素的后代元素中标签为label的元素 (10)查找表单元素中是否有id值为checkbox5的元素 提示: 为某dom元素应用某css样式可以使用jQuery中的addClass方法,例如:将id为tt的div元素应用.bt样式,可用些语句:$("#tt").addClass("color","red");
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值