关于jQuery的面试总结

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

答：在项目中是怎么用的是看看你有没有项目经验(根据自己的实际情况来回答) 你用过的选择器啊，复选框啊，表单啊，ajax啊，事件等

配置jQuery环境 下载jquery类库 在html页面引用jquery类库即可

<script type="text/JavaScript" src="jquery/jquery-1.11.1.min.js"/>

接下来通过在<script> $(function(){ }); </script>

2 、你为什么要使用jquery？（你觉得jquery有哪些好处？）

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

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

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

jquery库与其他库冲突：

<1>如果其他库在jquery库之前导入的话

1.我们可以通过jquery.noconflict()将变量的$的控制权过度给其他库

2.自定义快捷键,用一个变量接住jquery.noconflict()

3.通过函数传参

<2>如果jquery库在其他库之前导入就直接使用jquery

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

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

答 ：jQuery中的选择器大致分为:基本选择器，层次选择器，过滤选择器，表单选择器（具体查看文档）

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

答：jQuery选择器支持CSS里的选择器，jQuery选择器可用来添加样式和添加相应的行为CSS 中的选择器是只能添加相应的样式

6、 你觉得jquery中的选择器有什么优势？

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

        $('class')来代替document.getElementsByClassName()等。

        支持CSS1 到CSS3 选择器完善的处理机制(就算写错了id也不会报错)

7、  你在使用选择器的时候有有没有什么觉得要注意的地方？

答:  1 选择器中含有".","#","[" 等特殊字符的时候需要进行转译

      2 属性选择器的引号问题

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

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

答 ：jquery转DOM对象:jQuery 对象是一个数组对象，可以通过[index]得到相应的DOM对象还可以通过get[index]去得到相应的DOM对象。DOM对象转jQuery对象:$(DOM对象)

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

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

10、  你觉得jquery中的ajax好用吗，为什么？

   答: 好用的。 因为jQuery提供了一些日常开发中的快捷操作，例 load，ajax，get，post等等，所以使用jQuery开发ajax将变得极其简单，我们就可以集中精力在业务和用户的体验上，不需要去理会那些繁琐的XMLHttpRequest对象了。

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

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

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

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

      4 GET 方式请求的数据会被浏览器缓存起来，因此有安全问题。

12、  jquery中的load方法一般怎么用的？

答：load方法一般在 载入远程HTML 代码并插入到DOM中的时候用，通常用来从Web服务器上获取静态的数据文件。如果要传递参数的话，可以使用$.get() 或 $.post()。

13、  在jquery中你是如何去操作样式的？

答: addClass() 来追加样式 ，removeClass() 来删除样式，toggle() 来切换样式等。

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

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

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

答:使用过。hide() 和 show() 同时修改多个样式属性。像高度，宽度，不透明度。 fadeIn() 、fadeOut() 、fadeTo() 只改变不透明度。slideUp() 、 slideDown() 、slideToggle() 只改变高度。animate() 属于自定义动画的方法。

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

答：使用过，如jquery分页插件，jquery插件对已有的一系列方法或函数的封装，以便在其他地方重复使用，方便后期维护和提高开发效率

17、  你一般用什么去提交数据，为什么？

答:一般我会使用的是$.post() 方法。如果需要设定beforeSend(提交前回调函数),error(失败后处理),success(成功后处理及complete(请求完成后处理)回调函数等，这个时候我会使用$.ajax()

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

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

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

答:append(),appendTo(),prepend(),prependTo(),after(),insertAfter()，before(),insertBefore() 大致可以分为内部追加和外部追加append() 表式向每个元素内部追加内容。appendTo()表示将所有的元素追加到指定的元素中。例$(A)appendTo(B) 是将A追加到B中下面的方法解释类似。

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

答: wrapAll(),wrap(), wrapInner() 需要在文档中插入额外的结构化标记的时候可以使用这些包裹的方法因为它不会影响原始文档的语义。

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

答：jQuery中可以用attr()方法来获取和设置元素属性removeAttr() 方法来删除元素属性

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

答：html()方法 类似于innerHTML属性 可以用来读取或者设置某个元素中的HTML内容

注意：html() 可以用于xhtml文档 不能用于xml文档text() 类似于innerText属性 可以用来读取或设置某个元素中文本内容。val() 可以用来设置和获取input的值

23、  jquery中有哪些方法可以遍历节点？

答 ：children() 取得匹配元素的子元素集合,只考虑子元素不考虑后代元素 

        next() 取得匹配元素后面紧邻的同辈元素

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

        siblings() 取得匹配元素前后的所有同辈元素

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

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

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

答:子代元素是找子节点下的所有元素,后代元素是找子节点或子节点的子节点中的元素

25、 在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的用法前后调换一下即可。

26、 你觉得beforeSend方法有什么用？

答：有用，发送请求前可以修改XMLHttpRequest对象的函数，在beforeSend中如果返回false 可以取消本次的Ajax请求。XMLHttpRequest对象是唯一的参数所以在这个方法里可以做验证。

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

答: $('prev~div') 只能选择'prev'元素后面的同辈<div>元素而siblings()方法与前后的无关，只要是同辈节点就都能匹配。

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

答:使用过，在$.getJSON() 方法的时候就是。因为 $.getJSON() 就是用于加载JSON文件的。

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

答：:first 查询第一个，:last 查询最后一个，:odd查询奇数但是索引从0开始，:even 查询偶数，:eq(index)查询相等的 ,:gt(index)查询大于index的 ,:lt查询小于index，:header 选取所有的标题等

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

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

31、 jQuery中有几种方法可以来设置和获取样式

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

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

答: 两个方法有相似的功能，但是有区别的。 

window.onload方法是在网页中所有的元素(包括元素的所有关联文件)完全加载到浏览器后才执行的。

$(document).ready() 方法可以在DOM载入完成就对其进行操纵，并调用执行绑定的函数。

33、 jQuery是如何处理缓存的？

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

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

        2 通过$.get()方法 来获取数据，可以通过设置时间戳来避免缓存。可以在URL后面加上+(+new Date)例 $.get('ajax.xml?'+(+new Date),function () { //内容 });

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

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

答: $.getScript() 方法可以直接加载.js文件，并且不需要对javascript文件进行处理，javascript文件会自动执行。 $.getJson() 是用于加载JSON 文件的 。

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

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

36、 $("#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>

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

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

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

答：在网页中每个id名称只能用一次，class可以允许重复使用。

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

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

    1 HTML片段提供外部数据一般来说是最简单的。

    2 如果数据需要重用，而且其他应用程序也可能一次受到影响，那么在性能和文件大小方面具有优势的JSON通常是不错的选择。

    3 而当远程应用程序未知时，XML则能够为良好的操作性提供最可靠的保证。

40、 jQuery 能做什么？

答：1 获取页面的元素 

       2 修改页面的外观

       3 改变页面大的内容

       4 响应用户的页面操作

       5 为页面添加动态效果

      6 无需刷新页面，即可以从服务器获取信息

      7 简化常见的javascript任务

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

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

42、jQuery中的hover()和toggle()有什么区别？

答 ：hover()和toggle()都是jQuery中两个合成事件。hover()方法用于模拟光标悬停事件。 toggle()方法是连续点击事件。

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

答 : 知道,事件冒泡是从里面的往外面开始触发。在jQuery中提供了stopPropagation()方法可以阻止冒泡。

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

答: 可以用 event.preventDefault()或在事件处理函数中返回false，即 return false;

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

 答：1 formData:返回一个数组，可以通过循环调用来校验

        2 jaForm：返回一个jQuery对象，所有需要先转换成dom对象

        3 fieldValue：返回一个数组beforeSend()

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

插件的好处：对已有的一系列方法或函数的封装，以便在其他地方重新利用，方便后期维护和提高开发效率插件的分类：封装对象方法插件 、封装全局函数插件、选择器插件

注意的地方：

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

        2 所有的对象方法都应当附加到jQuery.fn对象上，而所有的全局函数都应当附加到jQuery对象本身上

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

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

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

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

转载于:https://my.oschina.net/dreamHarbour/blog/865728