jquery面试题

jQuery面试题答案

问答题：

问题：jQuery的美元符号$有什么作用？

回答：其实美元符号$只是”jQuery”的别名，它是jQuery的选择器，如下代码：

?

1 $(document).ready(function(){ 2 3 });

当然你也可以用jQuery来代替$，如下代码：

?

1 jQuery(document).ready(function(){ 2 3 });

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选择器上场的时候了，代码如下：

?

1

问题：当CDN上的jQuery文件不可用时，该怎么办？

回答：为了节省带宽和脚本引用的稳定性，我们会使用CDN上的jQuery文件，例如google的jquery cdn服务。但是如果这些CDN上的jQuery服务不可用，我们还可以通过以下代码来切换到本地服务器的jQuery版本：

\));

}//]]-->

问题：如何使用jQuery实现点击按钮弹出一个对话框？

回答：代码如下： HTML：

?

1

jQuery：

?

1

问题：jQuery中的Delegate()函数有什么作用？

回答：delegate()会在以下两个情况下使用到：

1、如果你有一个父元素，需要给其下的子元素添加事件，这时你可以使用delegate()了，代码如下：

?

1 $(\).delegate(\, \, function(){ 2 3 $(this).hide(); 4 5 });

2、当元素在当前页面中不可用时，可以使用delegate()

问题：怎样用jQuery编码和解码URL？

回答：在jQuery中，我们可以使用以下方法实现URL的编码和解码。

?

1 encodeURIComponent(url) and decodeURIComponent(url)

问题：如何用jQuery禁用浏览器的前进后退按钮？

回答：实现代码如下：

JavaScript部分

要点： 数据类型、面向对象、继承、闭包、插件、作用域、跨域、原型链、模块化、自定义事件、异步装载回调、模板引擎、Nodejs等。

js的几种数据类型：number,string,boolean,object,undefined

js的常见内置对象类：Date,Array,Math、Number、Boolean、String、Array、RegExp、Function...

?

通常可以做一些小练习来判断TA的水平，js 虽然很灵活，但是具体的代码和实现方式能体现出一个人的全局观，随着代码规模的增长，复杂度增加，如何合理划分模块实现功能和接口的能力比较重要。（下面例题）

?

[\

[typeof null, null instanceof Object]

[ [3,2,1].reduce(Math.pow), [].reduce(Math.pow)] ]

var val = 'smtg';

console.log('Value is ' + (val === 'smtg') ? 'Something' : 'Nothing');

?

1.创建一个对象

function Person(name, age) { this.name = name; this.age = age;

this.sing = function() { alert(this.name) } }

2.谈谈This对象的理解。

this是js的一个关键字，随着函数使用场合不同，this的值会发生变化。

但是总有一个原则，那就是this指的是调用函数的那个对象。

this一般情况下：是全局对象Global。 作为方法调用，那么this就是指这个对象

3.事件、IE与火狐的事件机制有什么区别？ 如何阻止冒泡？

1. 我们在网页中的某个操作（有的操作对应多个事件）。例如：当我们点击一个按钮就会产生一个事件。是可以被 JavaScript 侦测到的行为。 2. 事件处理机制：IE是事件冒泡、火狐是 事件捕获； 3. ev.stopPropagation();

4.什么是闭包（closure），为什么要用？

?

待完善

?

?

执行say667()后,say667()闭包内部变量会存在,而闭包内部函数的内部变量不会存在.使得Javascript的垃圾回收机制GC不会收回say667()所占用的资源，因为say667()的内部函数的执行需要依赖say667()中的变量。这是对闭包作用的非常直白的描述.

?

function say667() {

// Local variable that ends up within closure var num = 666;

var sayAlert = function() { alert(num); } num++; return sayAlert; }

var sayAlert = say667();

sayAlert()//执行结果应该弹出的667

?

5.如何判断一个对象是否属于某个类？ 使用instanceof （待完善） if(a instanceof Person){ alert('yes'); }

6.new操作符具体干了什么呢?

1、创建一个空对象，并且 this 变量引用该对象，同时还继承了该函数的原型。 2、属性和方法被加入到 this 引用的对象中。

3、新创建的对象由 this 所引用，并且最后隐式的返回 this 。

var obj = {};

obj.__proto__ = Base.prototype; Base.call(obj); 7.JSON 的了解

JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。它是基于JavaScript的一个子集。数据格式简单, 易于读写, 占用带宽小 {'age':'12', 'name':'back'} 8.js延迟加载的方式有哪些

? defer和async、动态创建DOM方式（用得最多）、按需异步载入js

9.ajax 是什么?ajax 的交互模型?同步和异步的区别?如何解决跨域问题?

?

待完善

?

1. 通过异步模式，提升了用户体验

2. 优化了浏览器和服务器之间的传输，减少不必要的数据往返，减少了带宽占用

3. Ajax在客户端运行，承担了一部分本来由服务器承担的工作，减少了大用户量下的服务器负载。

2. Ajax的最大的特点是什么。

Ajax可以实现动态不刷新（局部刷新）

readyState属性 状态 有5个可取值： 0=未初始化 ，1=正在加载 2=以加载，3=交互中，4=完成

? ?

ajax的缺点

?

1、ajax不支持浏览器back按钮。

2、安全问题 AJAX暴露了与服务器交互的细节。

3、对搜索引擎的支持比较弱。

4、破坏了程序的异常机制。

5、不容易调试。

?

?

跨域： jsonp、 iframe、window.name、window.postMessage、服务器上设置代理页面

10.模块化怎么做？

立即执行函数,不暴露私有成员 var module1 = (function(){ var _count = 0; var m1 = function(){ //... };

var m2 = function(){ //... }; return { m1 : m1,

m2 : m2 }; })();

11.对Node的优点和缺点提出了自己的看法：

*（优点）因为Node是基于事件驱动和无阻塞的，所以非常适合处理并发请求， 因此构建在Node上的代理服务器相比其他技术实现（如Ruby）的服务器表现要好得多。

此外，与Node代理服务器交互的客户端代码是由javascript语言编写的， 因此客户端和服务器端都用同一种语言编写，这是非常美妙的事情。

*（缺点）Node是一个相对新的开源项目，所以不太稳定，它总是一直在变， 而且缺少足够多的第三方库支持。看起来，就像是Ruby/Rails当年的样子。 12.异步加载的方式 (1) defer，只支持IE

(2) async：

(3) 创建script，插入到DOM中，加载完毕后callBack

documen.write和 innerHTML的区别

document.write只能重绘整个页面

innerHTML可以重绘页面的一部分 13.告诉我答案是多少？ (function(x){ delete x; alert(x); })(1+5);

函数参数无法delete删除，delete只能删除通过for in访问的属性。 当然，删除失败也不会报错，所以代码运行会弹出“1”。 14.JS中的call()和apply()方法的区别？

例子中用 add 来替换 sub，add.call(sub,3,1) == add(3,1) ，所以运行结果为：alert(4); 注意：js 中的函数其实是对象，函数名是对 Function 对象的引用。 function add(a,b) {

alert(a+b); }

function sub(a,b) {

alert(a-b); }

add.call(sub,3,1);

15.Jquery与jQuery UI 有啥区别？

*jQuery是一个js库，主要提供的功能是选择器，属性修改和事件绑定等等。

*jQuery UI则是在jQuery的基础上，利用jQuery的扩展性，设计的插件。 提供了一些常用的界面元素，诸如对话框、拖动行为、改变大小行为等等 16.jquery 中如何将数组转化为json字符串，然后再转化回来？ jQuery中没有提供这个功能，所以你需要先编写两个jQuery的扩展： $.fn.stringifyArray = function(array) { return JSON.stringify(array) }

$.fn.parseArray = function(array) { return JSON.parse(array) }

然后调用：

$(\

17.JavaScript中的作用域与变量声明提升？

一、Jquery测试题

下面哪种不是jquery的选择器？(单选)

A、基本选择器 B、后代选择器 C、类选择器 D、进一步选择器 考点:jquery的选择器 (C)

当DOM加载完成后要执行的函数，下面哪个是正确的？(单选)

jQuery(expression, [context]) B、jQuery(html, [ownerDocument]) C、jQuery(callback) D、jQuery(elements)

考点：jquery的核心函数 (C)

下面哪一个是用来追加到指定元素的末尾的？(单选) A、insertAfter() B、append() C、appendTo() D、after() 考点：jquery的核心函数 (C)

下面哪一个不是jquery对象访问的方法？(单选)

A、each(callback) B、size() C、index(subject) D、index() 考点： jquery的核心函数之对象访问 （D）

jquery访问对象中的size()方法的返回值和jQuery对象的_______属性一样. 考点：jquery的核心函数之对象访问 （length） jquery中$(this).get(0)的写法和__________是等价的。 考点：jquery的核心函数之对象访问 （$(this)[0]） 7. 有这样一个表单元素

，想要找到这个hidden元素，下面哪个是正确的？(单选) A、visible B、hidden C、visible() D、hidden() 考点：jquery的选择器 （B）

如果需要匹配包含文本的元素，用下面哪种来实现？(单选) A、text() B、contains() C、input() D、attr(name) 考点：jquery的选择器 （B）

现有一个表格，如果想要匹配所有行数为偶数的，用________实现，奇数的用_______实现。

考点：jquery的选择器 （even,odd）

如果想要找到一个表格的指定行数的元素，用下面哪个方法可以快速找到指定元素？(单选) A、text() B、get() C、eq() D、contents（） 考点：jquery的选择器 （C）

在一个表单里，想要找到指定元素的第一个元素用_________实现，那么第二个元素用_________实现。

考点：jquery的选择器 （first,eq(1)） 下面哪种不属于jquery的筛选？（单选） A、过滤 B、自动 C、查找 D、串联 考点：jquery的筛选 (B)

下面哪几种是属于jquery文档处理的？ （多选） A、包裹 B、替换 C、删除 D、内部和外部插入 考点：jquery的文档处理 (ABD)

如果想在一个指定的元素后添加内容，下面哪个是实现该功能的？（单选）

A、append(content) B、appendTo(content) C、insertAfter(content) D、after(content) 考点：jquery的文档处理 (D)

在jquery中，用一个表达式来检查当前选择的元素集合，使用______来实现，如果这个表达式失效，则返回___________值。 考点：jquery的筛选 （is(expr),false）

在jquey中，如果想要从DOM中删除所有匹配的元素，下面哪一个是正确的？（单选） A、delete() B、empty() C、remove() D、removeAll() 考点：jquery的文档处理 （C）

在jquery中，想要给第一个指定的元素添加样式，下面哪一个是正确的？（单选） A、first B、eq(1) C、css(name) D、css(name,value) 考点： jquery的css处理 （C）

在编写页面的时候，如果想要获取指定元素在当前窗口的相对偏移，用_________来实现，该方法的返回值有两个属性，分别是________和__________。 考点：jquery的css处理 （offset,top,left）

在jquery中，如果想要获取当前窗口的宽度值，下面哪个是实现该功能的？ （单选） A、width() B、width(val) C、width D、innerWidth() 考点：jquery的css处理 （A）

在一个表单中，如果将所有的div元素都设置为绿色，实现功能是____________________________。

考点：jquery的css处理 ($(“div”).css(“color”,”green”))

为每一个指定元素的指定事件（像click）绑定一个事件处理器函数，下面哪个是用来实现该功能的？ （单选）

A、trigger (type) B、bind(type) C、one(type) D、bind 考点：jquery的事件操作 (B)

在jquery中，鼠标移动到一个指定的元素上，会触发指定的一个方法，实现该操作的是______________。

考点：jquery的事件操作 (hover(over,out)) 下面哪几个不是属于jquery的事件处理? (多选) A、bind(type) B、click() C、change() D、one(type) 考点：jquery的事件处理 (BC)

在一个表单中，如果想要给输入框添加一个输入验证，可以用下面的哪个事件实现？ (单选) A、hover(over ,out) B、keypress（fn） C、change() D、change(fn) 考点：jquery的事件处理 (D)

当一个文本框中的内容被选中时，想要执行指定的方法时，可以使用下面哪个事件来实现？（单选）

A、click(fn) B、change(fn) C、select(fn) D、bind(fn) 考点：jquery的事件处理 (C)

在jquery中，想让一个元素隐藏，用________实现，显示隐藏的元素用_________实现。 考点：jquery的页面效果 （hide(),show()）

在一个表单中，用600毫秒缓慢的将段落滑上，用__________________________________来实现。 考点：jquery的页面效果 （$(“p”).slideUp(“slow”)）

在jquery中，如果想要自定义一个动画，用___________________________函数来实现。 考点：jquery的页面效果 (animate(params, options))

在jquery中想要实现通过远程http get请求载入信息功能的是下面的哪一下事件？ (单选) A、$.ajax() B、load(url) C、$.get(url) D、$. getScript(url) 考点：jquery的ajax (C)

下面不属于ajax事件的是？ (单选)

A、ajaxComplete(callback) B、ajaxSuccess(callback) C、$.post(url) D、ajaxSend(callback) 考点：jquery的ajax （C）

彻底将jQuery变量还原，可以使用___________________方法实现。 考点：jquery的多库共存 ($.noConflict(extreme)) 上机题：

用jquery 来实现动态添加和删除表格行

在一个表单中，查找所有选中的input元素，可以用jquery中的____________________来实现。

考点：jquery的选择器（:not()）

下面哪几种是jquery中表单的对象属性？（多选）

A、:checked B、: enabled C、:hidden D、:selected E、:file F、: disabled 考点：jquery的选择器（ABDF）

在jquery中如果将一个“名/值”形式的对象设置为所有指定元素的属性，可以用________________实现。

考点：jquery选择器之属性 （attr(pro)）

在jquery中指定一个类，如果存在就执行删除功能，如果不存在就执行添加功能，下面哪一个是可以直接完成该功能的？（单选）

A、removeClass() B、deleteClass() C、toggleClass(class) D、addClass() 考点：jquery的属性 （C）

在jquery中想要找到所有元素的同辈元素，下面哪一个是可以实现的？（单选） A、eq(index) B、find(expr) C、siblings([expr]) D、next() 考点：jquery的筛选 （C） 二、css测试题

css的语法由___________、_____________、____________三部分组成。 考点：css的语法 (选择器、属性和值)

下面哪一个不是检索一个对象的定位方式的属性? （单选） A、static B、absolute C、fixed D、top 考点：css的定位 （D）

下面哪个是display布局中用来设置对象以块显示，并添加新行的？ （单选） A、inline B、none C、block D、compact 考点：css的布局 (C)

设置边框的边框样式用_____________实现，设置边框的颜色用_________实现。 考点：css的边框 （border-style,border-color）

设置一个div的最小宽度为100像素，最大高度为50像素，实现这两个设置的方法是_______、________________。

考点：css的尺寸 (min-width：100px; min-height：50px;)

为一个图片设置成背景图像后，设置背景图像在纵向和横向上平铺，下面哪个是实现该功能的？ (单选)

A、no-repeat B、repeat C、repeat-x D、repeat-y 考点：css的背景background (repeat)

想要设置一个对象外的线条轮廓的样式为虚线边框，用_______________实现该功能。 考点：css的轮廓outline (outline-style: dashed)

在css中，如果想要阻止计数器增加的，用__________________来实现。 考点：css的内容content (counter-increment : none)

在编写css样式的时候，如果想要设置标记容器和主容器之间的补白，用_______________来表示。

考点：css的列表 (marker-offset)

如果想设置表格的行与单元格的边框合并在一起，可以用___________________来实现。 考点：css的表格 （border-collapse：collapse）

如果想设置一个对象内文本的流动和方向，用_______________标签来实现，该标签有两个值，分别是_____________、______________。

考点：css的文本Text （text-layout-flow，horizontal、vertical-ideographic）

在编写css样式的时候，如果想要设置文本的对齐方式，下面哪一个不是text-align下的值？（单选）

A、left B、right C、top D、justify 考点：css的文本 Text (C)

在css中，如果想要设置对象中文本的样式，下面哪一个不是该标签的值？(单选) A、blink B、line-through C、color D、overline 考点：css的字体font （C）

在css中，设置滚动条的表面颜色，是用下面的哪个标签来实现的？（单选） A、scrollbar-base-color B、scrollbar-face-color C、scrollbar-arrow-color D、scrollbar-shadow-color 考点：css的滚动条scrollbar（B） 三、UML测试题

1. 标准建模语言UML的重要内容可以由______________、____________、_________、________、_________________五类图表示。

考点：uml的分类 （用例图，静态图（包括类图），行为图，交互图和实现图） 2. 下面哪一个不是建模的基本原则? A、要仔细的选择模型

B、每一种模型可以在不同的精度级别上表示所要开发的系统 C、模型要与现实相联系

D、对一个重要的系统用一个模型就可以充分描述 考点：uml的基本原则 (D)

3.在uml中， ________________和_________________都是状态机的表现形式。 考点：uml的活动图 (活动图与状态图)

4. 下面的元素中，哪些是时序图所需要的？ （多选）

A、类角色 B、生命线 C、激活期 D、分支 E、动作流 F、消息 考点：uml的时序图 （ABCF）

5. 综合题：请画出一个银行客户在ATM机器上查看余额信息的类图，活动图及时序图三种。 类图： 活动图： [img][/img] 时序图： [img][/img]

用UML建立业务模型是理解企业业务过程的第一步。使用活动图可显务工作流的步骤和决策点，以及完成每一个步骤的角色和对象，下面哪一点是它主要强调的？（单选） A、上下层次关系 B、时间和顺序 C、对象间的迁移 D、对象间的控制流 考点：活动图的作用 （D）

UML中哪些图表示系统行为？ （多选）

A、状态图 B、用例图 C、协作图 D、类图 E、活动图 F、时序图 考点：UML （ACEF）

本文来源：https://www.bwwdw.com/article/hfs3.html