总结的web前端的jquery面试题 常见面试题 大牛回答

【点击领取】阿里云代金券 | 阿里云优惠券 |阿里云优惠码|云服务器|阿里云|阿里云代金券 – 限时领取1888元阿里云代金券

【3折购买ECS服务器入口】：promotion.aliyun.com/ntms/act/qw…

一、你在公司是怎么用jquery的？ 

答：在项目中是怎么用的是看看你有没有项目经验(根据本身的实际状况来回答) 你用过的选择器啊，动画啊，表单啊，ajax事件等  

配置Jquery环境 下载jquery类库 在jsp页面引用jquery类库便可 

 <script type="text/javascript" src="jquery/jquery-1.7.2.min.js"/></script>  

<script> 

$(function(){ }); 

 </script> 

二、你为何要使用jquery？  

答：由于jQuery是轻量级的框架，大小不到30kb,它有强大的选择器，出色的DOM操做的封装，有可靠的事件处理机制(jQuery在处理事件绑定的时候至关的可靠)，完善的ajax(它的ajax封装的很是的好，不须要考虑复杂浏览器的兼容性和XMLHttpRequest对象的建立和使用的问题。) 出色的浏览器的兼容性。并且支持链式操做，隐式迭代。行为层和结构层的分离，还支持丰富的插件，jquery的文档也很是的丰富。 

三、你以为jquery有哪些好处？ 答案同上

四、你使用jquery遇到过哪些问题，你是怎么解决的？ 

答：这个答案是开发的，看你是否有相关的项目经验。 

例：前台拿不到值，JSON 但是出现的错误(多了一个空格等)这编译是不会报错的 jquery库与其余库冲突； 

今天在处理一个数据问题时，发现jQuery.ajax()方法返回的值一直有问题，清除缓存后数据无误，屡次测试后发现返回的值都是以前的值，而且一直未执行url(后台为JAVA，设置断点一直未进入)。在网上查找下,发现是未设置type的缘由。若是没设置jQuery.ajax的type="Post"，那么ajax就会默认type="Get"，这就会致使以前数据被缓存起来。加上type="Post"，问题解决！  

五、你知道jquery中的选择器吗，请讲一下有哪些选择器？ 

答 ：选择器大体分为:基本选择器，层次选择器，过滤选择器，表单选择器 

六、jquery中的选择器 和 css中的选择器有区别吗？ 

答：jQuery选择器支持CSS里的选择器， 

 jQuery选择器可用来添加样式和添加相应的行为 

 CSS 中的选择器是只能添加相应的样式 

 七、你以为jquery中的选择器有什么优点？ 

答：简单的写法 $('ID') 来代替 document.getElementById()函数  

支持CSS1 到CSS3 选择器 

 完善的处理机制(就算写错了id也不会报错) 

八、你在使用选择器的时候有有没有什么以为要注意的地方？ 

答: 

一、选择器中含有".","#","[" 等特殊字符的时候须要进行转译 

二、属性选择器的引号问题 

三、选择器中含有空格的注意事项 

九、jquery对象和dom对象是怎样转换的？  

答 ：jquery转DOM对象:jQuery 对象是一个数组对象，能够经过[index]的丰富获得相应的DOM对象 还能够经过get[index]去获得相应的DOM对象。 

 DOM对象转jQuery对象:$(DOM对象) 

十、你是如何使用jquery中的ajax的？ 

答: 若是是一些常规的ajax程序的话，使用load(),$.get(),$.post(),就能够搞定了，通常我会使用的是$.post() 方法。若是须要设定beforeSend(提交前回调函数),error(失败后处理),success(成功后处理)及complete(请求完成后处理)回调函数等，这个时候我会使用$.ajax() 

十一、你以为jquery中的ajax好用吗，为何？  

答: 好用的。由于jQuery提供了一些平常开发中夙瑶的快捷操做，例 load，ajax，get，post等等，因此使用jQuery开发ajax将变得极其简单，咱们就能够集中精力在业务和用户的体验上，不须要去理会那些繁琐的XMLHttpRequest对象了。  

十二、jquery中$.get()提交和$.post()提交有区别吗？ 

答: 

一、$.get() 方法使用GET方法来进行异步请求的。 $.post() 方法使用POST方法来进行异步请求的。 

二、get请求会将参数跟在URL后进行传递，而POST请求则是做为HTTP消息的实体内容发送给Web服务器的，这种传递是对用户不可见的。 

三、get方式传输的数据大小不能超过2KB 而POST要大的多 

四、GET 方式请求的数据会被浏览器缓存起来，所以有安全问题。 

1三、jquery中的load方法通常怎么用的？ 

答：load方法通常在载入远程HTML代码并插入到DOM中的时候用 

一般用来从Web服务器上获取静态的数据文件。 

 若是要传递参数的话，可使用$.get() 或 $.post() 

 1四、在jquery中你是如何去操做样式的？ 

 答: addClass() 来追加样式 

 removeClass() 来删除样式 

 toggle() 来切换样式 

1五、简单的讲叙一下jquery是怎么处理事件的，你用过哪些事件？  

答: 首先去装载文档，在页面家在完毕后，浏览器会经过javascript 为DOM 元素添加事件。 

1六、你使用过jquery中的动画吗，是怎样用的？ 

 答:使用过。 

hide() 和 show() 同时修改多个样式属性。像高度，宽度，不透明度。 fadeIn() 和fadeOut() fadeTo() 只改变不透明度 

slideUp() 和 slideDown() slideToggle() 只改变高度 

animate() 属于自定义动画的方法. 

1七、你使用过jquery中的插件吗？ 

答:看我的的实力和经验来回答了，例如：jQuery_Mobile,jQuery_ui。 

1八、你通常用什么去提交数据，为何？ 

 答:通常我会使用的是$.post() 方法。 

若是须要设定beforeSend(提交前回调函数),error(失败后处理),success(成功后处理)及complete(请求完成后处理)回调函数等，这个时候我会使用$.ajax() 

1九、在jquery中引入css有几种方式？ 

 答:四种 行内式，内嵌式，导入式，连接式 

20、你在jquery中使用过哪些插入节点的方法，它们的区别是什么？ 

答:append(),appendTo(),prepend(),prependTo(),after(),insertAfter() before(),insertBefore() 

内添加 

1. append在文档内添加元素 
2. appendTo()把匹配的元素添加到对象里 
3. prepend()在元素前添加 
4. prependTo()把匹配的元素添加到对象前 

外添加 

1. after()在元素以后添加 
2. before()在元素以前添加 
3. insertAfter()把匹配元素在对象后添加 
4. insertBefore()把匹配元素在对象前添加 

2一、你使用过包裹节点的方法吗，包裹节点有方法有什么好处？  

答: 

1. wrap()把匹配的元素包裹起来 
2. wrapAll()把全部匹配的对象用单个元素包裹 
3. wrapInner()将每个元素的子内容包裹 须要在文档中插入额外的结构化标记的时候可使用这些包裹的方法，应为它不会帛画原始文档的语义 

2二、jquery中如何来获取或和设置属性？ 

答：jQuery中能够用attr()方法来获取和设置元素属性 

 removeAttr() 方法来删除元素属性 

2三、如何来设置和获取HTML 和文本的值？  

答：html()方法 相似于innerHTML属性 能够用来读取或者设置某个元素中的HTML内容注意：html() 能够用于xhtml文档，不能用于xml文档 

Text() 相似于innerText属性 能够用来读取或设置某个元素中文本内容。  

val() 能够用来设置和获取元素的值 

2四、你jquery中有哪些方法能够遍历节点？  

答 ：children() 取得匹配元素的子元素集合,只考虑子元素不考虑后代元素 next() 取得匹配元素后面紧邻的同辈元素 

prev() 取得匹配元素前面紧邻的同辈元素 

siblings() 取得匹配元素先后的全部同辈元素 

closest() 取得最近的匹配元素 

find() 取得匹配元素中的元素集合 包括子代和后代

2五、子元素选择器和后代选择器元素有什么区别？  

答:子代元素是找子节点下的全部元素,后代元素是找子节点或子节点的子节点的元素  

2六、在jquery中能够替换节点吗？ 

答：能够 在jQuery中有二者替换节点的方式replaceWith() 和 replaceAll() 例如：在<p title="hao are you">hao are you</p>替换成<strong>I am fine<strong> $('p').replaceWith('<strong>I am fine</strong>'); 

replaceAll 与replaceWith的用法先后调换一下便可。 

2七、你以为beforeSend方法有什么用？ 

答：发送请求前能够修改XMLHttpRequest对象的函数，在beforeSend中，若是返回false能够取消本次的Ajax请求。XMLHttpRequest对象是惟一的参数，因此在这个方法里能够作验证 

2八、siblings() 方法 和 $('prev~div')选择器是同样的嘛？  

答: $('prev~div') 只能选择'#prev'元素后面的同辈<div>元素 

而siblings()方法与先后的文职无关，只要是同辈节点就都能匹配。  

2九、你在ajax中使用过JSON吗，你是如何用的？  

答:使用过，在$.getJSON()方法的时候就是。 

由于 $.getJSON() 就是用于加载JSON文件的 

30、有哪些查询节点的选择器？ 

 答：我在公司使用过 

 :first 查询第一个， :last 查询最后一个， 

:odd查询奇数可是索引从0开始 :even 查询偶数，  

:eq(index)查询相等的 , :gt(index)查询大于index的 , 

:lt查询小于index :header 选取全部的标题等 

3一、nextAll()能替代$('prev~siblindgs')选择器吗？ 

答:能。使用nextAll() 和使用$('prev~siblindgs') 是同样的  

3二、jQuery中有几种方法能够来设置和获取样式 

 答 ：addClass() 方法，attr() 方法 

3三、$(document).ready()方法和window.onload有什么区别？

答: 两个方法有类似的功能，可是在实行时机方面是有区别的。  

1. window.onload方法是在网页中全部的元素(包括元素的全部关联文件)彻底加载到浏览器后才执行的。 
2. $(document).ready() 方法能够在DOM载入就绪时就对其进行操纵，并调用执行绑定的函数。 

3四、jQuery是如何处理缓存的？ 

答 ：要处理缓存就是禁用缓存. 

1. 经过$.post() 方法来获取数据，那么默认就是禁用缓存的。  

2. 经过$.get()方法 来获取数据，能够经过设置时间戳来避免缓存。 

能够在URL后面加上+(+new Date) 

例 $.get('ajax.xml?'+(+new Date),function () { //内容 });  

3. 经过$.ajax 方法来获取数据，只要设置cache:false便可。 

3五、$.getScript()方法 和 $.getJson() 方法有什么区别？ 

答: 

1 $.getScript() 方法能够直接加载.js文件，而且不须要对javascript文件进行处理，javascript文件会自动执行。 

2 $.getJson() 是用于加载JSON 文件的 ，用法和$.getScript()  

3六、你读过有关于jQuery的书吗？ 

答: 《jquery基础教程》，《jquery实战》，《锋利的jquery》，《巧用jquery》，《jQuery用户界面库学习指南》等 

3七、$("#msg").text(); 和 $("#msg").text("<b>new content</b>");有什么区别？ 

答：

1. $("#msg").text() 是 返回id为msg的元素节点的文本内容 
2. $("#msg").text("<b>new content</b>");是 将“<b>new content</b>”做为普通文本串写入id为msg的元素节点内容中, 页面显示粗体的<b>new content</b> 

3八、radio单选组的第二个元素为当前选中值，该怎么去取？ 

答 : $('input[name=items]').get(1).checked = true; 

3九、选择器中 id，class有什么区别？ 

答：在网页中 每一个id名称只能用一次，class能够容许重复使用  

40、你使用过哪些数据格式，它们各有什么特色？  

答: HTML格式 ,JSON格式,javascript格式,XML格式

1. HTML片断提供外部数据通常来讲是最简单的。  
2. 若是数据须要重用，并且其余应用程序也可能一次受到影响，那么在性能和文件大小方面具备优点的JSON一般是不错的选择。 
3. 而当远程应用程序未知时，XML则可以为良好的互操做性提供最可靠的保证。  

4一、jQuery 能作什么？ 

 答：

1. 获取页面的元素 
2. 修改页面的外观 
3. 改变页面大的内容 
4. 响应用户的页面操做 
5. 为页面添加动态效果 
6. 无需刷新页面，便可以从服务器获取信息 
7. 简化常见的javascript任务 

4二、在ajax中data主要有几种方式？ 

答 ： 三种，html拼接的，json数组，form表单经serialize()序列化的。  

4三、：jQuery中的hover()和toggle()有什么区别？  

答：hover()和toggle()都是jQuery中两个合成事件。 

hover()方法用于模拟光标悬停事件。 

 toggle()方法是连续点击事件。  

4四、你知道jQuery中的事件冒泡吗，它是怎么执行的，何如来中止冒泡事件？ 

答 : 知道, 事件冒泡是从里面的往外面开始触发。  

在jQuery中提供了stopPropagation()方法能够中止冒泡。  

4五、例如 单击超连接后会自动跳转，单击"提交"按钮后表单会提交等，有时候我想阻止这些默认的行为，该怎么办？ 

答: 能够用 event.preventDefault() 

 或 在事件处理函数中返回false，即 return false; 

4六、jquery表单提交前有几种校验方法？分别为？？  

答：formData:返回一个数组，能够经过循环调用来校验 

jaForm：返回一个jQuery对象，全部须要先转换成dom对象 

fieldValue：返回一个数组 beforeSend() 

4七、在jquery中你有没有编写过插件，插件有什么好处？你编写过那些插件？它应该注意那些？ 

答: 插件的好处：对已有的一系列方法或函数的封装，以便在其余地方从新利用，方便后期维护和提升开发效率 

插件的分类：封装对象方法插件 、封装全局函数插件、选择器插件注意的地方：  

1.插件的文件名推荐命名为jquery.[插件名].js，以避免和其余的javaScript库插件混 

2.全部的对象方法都应当附加到jQuery.fn对象上，而全部的全局函数都应当附加到jQuery对象自己上 

3.插件应该返回一个jQuery对象，以保证插件的可链式操做  

4.避免在插件内部使用$做为jQuery对象的别名,而应使用完整的jQuery来表示，这样能够避免冲突或使用闭包来避免 

5.全部的方法或函数插件，都应当一分好结尾，不然压缩的时候可能出现问题。在插件头部加上分号，这样能够避免他人的不规范代码给插件带来影响 

6.在插件中经过$.extent({})封装全局函数,选择器插件，扩展已有的object对象经过$.fn.extend({})封装对象方法插件  

4八、怎样给jquery动态附加新的元素?那么怎样给新生成的元素绑定事件呢？  

答：jQuery的html()能够给如今元素附加新的元素 直接在元素还未生成前就绑定确定是无效的，由于所绑定的元素目前根本不存在。 因此咱们能够经过live和livequery来动态绑定事件

4九、Jquery与jQuery UI 有啥区别？ 

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

*jQuery UI则是在jQuery的基础上，利用jQuery的扩展性，设计的插件。 

提供了一些经常使用的界面元素，诸如对话框、拖动行为、改变大小行为等等 

50、jquery 中如何将数组转化为json字符串，而后再转化回来？ 

答：jQuery中没有提供这个功能，因此你须要先编写两个jQuery的扩展： 

$.fn.stringifyArray = function(array) { 

 return JSON.stringify(array) 

 } 

 $.fn.parseArray = function(array) { 

 return JSON.parse(array) 

 } 

 而后调用： 

 $("").stringifyArray(array)

【点击领取】阿里云代金券 | 阿里云优惠券 |阿里云优惠码|云服务器|阿里云|阿里云代金券 – 限时领取1888元阿里云代金券

【3折购买ECS服务器入口】：promotion.aliyun.com/ntms/act/qw…