jQuery面试题总结(简版)

淡淡的烟草味﹌ 2022-11-13 11:22 222阅读 0赞

### 1. 请写出js和jquery的入口函数，并简述他们的不同 ###

jQuery：$(document).ready()方法
    	js：window.onload
    	执行时间不同：window.onload必须等到页面内的所有元素（）加载完毕后才能执行。
    	$(document).ready()是页面DOM结构绘制完毕后就执行，不必等到加载完毕
    	执行次数不同：window.onload不能同时执行多个，$(document).ready()可以同时执行多个

### 2. 请写出jquery动画的显示和隐藏 ###

显示：show()
    	隐藏：hide()

### 3. 请写出jquery中绑定事件的四种方式 ###

jQuery中提供了四种事件监听方式，分别是bind、live、delegate、on，
    	对应的解除监听的函数分别是unbind、die、undelegate、off。

### 4. 什么是jQuery？ ###

jQuery 是一个 JavaScript 库，极大地简化了 JavaScript 编程。

### 5. jQuery 库中的 $() 是什么 ###

$() 是一个函数，和jQuery函数相等相当于jQuery函数的简写。

### 6. 网页上有 5 个  元素，如何使用 jQuery来选择它们？ ###

$("div")

### 7. jQuery 里的 ID 选择器和 class 选择器有何不同？ ###

ID 选择器 用 $("#div")    class 选择器用 $(".div")
    	只需要选择一个元素时，使用ID选择器
    	如果需要选择具有相同 CSS class的元素，就要用class 选择器

### 8. jQuery 里的 each() 是什么函数？你是如何使用它的？ ###

是循环遍历所选择到的一组元素的函数，相当于程序中的for循环
    	$(selector).each(function(index,element))

### 9. $(this) 和 this 关键字在 jQuery 中有何不同？ ###

1、表示对象不同：this表示的是javascript提供的当前对象，$(this)表示的是用jquery封装候的当前对象。
    	2、过程不同：this对象可以直接用this.style修改样式，$(this)可以使用jquery提供的方法访问样式。

### 10. 你如何利用jQuery来向一个元素中添加和移除CSS类? ###

Jquery 使用addClass()添加与removeClass()删除来动态的添加或移出一个css 类

### 11. 什么是ajax，为什么使用ajax？ ###

Ajax是异步JavaScript和XML
    	是一种创建交互式网页应用的网页开发技术。

### 12.ajax都有哪些优点和缺点？ ###

优点：不用刷新就可以更新数据，异步与服务器通信，前端和后端负载平衡，界面与应用分离
    	缺点：对浏览器机制破坏，对搜索引擎支持较弱，不能很好支持移动设备

### 13.post请求和get请求的区别？ ###

最直观的区别就是GET把参数包含在URL中，POST通过request body传递参数。
    	GET在浏览器回退时是无害的，而POST会再次提交请求。
    	GET产生的URL地址可以被Bookmark，而POST不可以。
    	GET请求会被浏览器主动cache，而POST不会，除非手动设置
    	GET请求在URL中传送的参数是有长度限制的，而POST么有
    	GET请求参数会被完整保留在浏览器历史记录里，而POST中的参数不会被保留。

### 14.什么是跨域? ###

当一个请求url的协议、域名、端口三者之间任意一个与当前页面url不同即为跨域

### 15.请简述同步和异步的区别. ###

同步是阻塞模式，
    	异步是非阻塞模式。
    	同步就是指一个进程在执行某个请求的时候，若该请求需要一段时间才能返 回信息，那么这个进程将会一直等待下去，直到收到返回信息才继续执行下去；
    	异步是指进程不需要一直等下去， 而是继续执行下面的操作，不管其他进程的状态。当有消息返回时系统会通知进程进行处理，这样可以提高执行的效 率。

### 16.HTTP协议中，GET和POST有什么区别？分别适用什么场景？ ###

（1）GET请求资源数据，POST向服务器传递需要处理的数据
    	（2）GET传递数据大小不超过2kb，POST没有限制
    	（3）GET请求的参数会在Url上暴露显示，POST请求参数在Requestbody里，所以相对GET来说，POST安全性较高
    	（4）GET 请求的静态资源会被浏览器缓存，POST不会被缓存
    	（5）GET传递的数据类型是文本，POST是文本或者二进制
    	（6）GET请求被回退时是无害的，POST请求被回退是会被重新再执行一次
             分别适用的场景
    
    	（1）在传递一些机密信息时必须要使用POST
    	（2）只是查询获取数据时可以用GET
    	（3）POST请求速率会比GET慢，因为GET请求产生一个TCP数据包;POST请求产生两个TCP数据包

### 17. 将以下jquery选择符翻译成中文描述：$(“\#d div.cls input\[type=text\]\[name^=text\_\]”); ###

这个应该是: id为d的对象中class为cls的div中type为text但不包含name为text.的input对象

### 18. 请说出你知道的跨域的方法有哪些？最常用的是哪个？怎么使用的？ ###

1、JSONP   2、代理   3、PHP端修改头部   4、iframe   5.通过 window.name 实现跨域
    	常用JSONP进行跨域，jsonp形式的ajax请求:并且通过get请求的方式传入参数,
    	需要注意:跨域请求只能使用get请求不能使用post请求。

### 19. 常见请求头与响应头你了解哪些？ ###

请求头：Accept	可接受的响应内容类型
    		Accept-Charset	可接受的字符集
    		Accept-Encoding	可接受的响应内容的编码方式。
    	  响应头：Accept-Patch	指定服务器所支持的文档补丁格式
    		Age	响应对象在代理缓存中存在的时间，以秒为单位
    		Allow	对于特定资源的有效动作;

### 20. 如何设置ajax为同步或异步 ###

在ajax的参数中增加一个async: false参数可以发送同步ajax请求

### 21. 请写出ajax框架格式，并简述每个属性的作用 ###

$.ajax({ 
    	        type: "POST", // 请求方式(post/get)
    	        url: "", // 请求地址
    	        data:{ },// 存放请求参数
    	        success: function(result) {  // 请求成功,返回参数
    	                console.log(result);
    	                console.log(JSON.parse(result));
    	        },
    	        error: function(e) {  // 请求错误,包含具体错误信息
    	                console.log(e.status);
    	                console.log(e.responseText);
    	        }
    	})

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

执行时间不同：window.onload必须等到页面内的所有元素（）加载完毕后才能执行。
    	$(document).ready()是页面DOM结构绘制完毕后就执行，不必等到加载完毕
    	执行次数不同：window.onload不能同时执行多个，$(document).ready()可以同时执行多个

### 23. Flash、Ajax各自的优缺点，在使用中如何取舍 ###

Flash 适合处理多媒体、矢量图形、访问机器；对CSS、处理文本上不足，不容易被搜索。
    	ajax 对 CSS、文本支持很好，支持搜索；多媒体、矢量图形、机器访问不足。

### 24. 同源策略介绍及解析 ###

同源:协议相同 域名相同 端口相同
    	目的:为了保证用户信息的安全,防止恶意的网站窃取数据

### 25. 前端如何性能优化 ###

1、 减少http请求
    	2、 减少资源体积
    	3、 缓存（dns缓存、cdn部署与缓存、http缓存）
    	4、 优化网页渲染
    	5、 dom操作优化
    	6、 异步请求优化
    	等等.... ...

### 26. jQuery遍历节点的方法 ###

children（）返回被选元素的所有直接子元素
    	find（）返回被选元素的后代元素
    	first（）返回被选元素的第一个元素
    	last（）返回被选元素的最后一个元素
    	next（）返回被选元素的后一个同级元素
    	nextAll（）返回被选元素后面的所有同级元素
    	prev（）返回被选元素的前一个同级元素
    	prevAll（）返回被选元素的前面的所有同级元素
    	parent()返回包含此元素的唯一父节点的元素集合

### 27. ajax中get和post的区别，datatype返回的数据类型有哪些？ ###

post和get的区别：post方式是把数据内容放在请求的数据正文部分，没有长度的限制;get方式则是把数据内容直接跟在请求的头部的URL后面，有长度的限制。而一般在表单的数据提交中，都会选择POST方式，因为使用GET方法数据是通过URL传递的，在地址栏中会直接看到传递的数据，这样就缺少安全性。而使用POST传递时，是把提交的数据放置在HTTP包的包体中，地址栏不会看到数据。
    	返回的数据类型默认是字符串string。
    	数据类型一共有：xml、HTML、script、json、jsonp、text。

### 28. xml与json的区别 ###

xml定义
    	指可扩展标记语言，用来传输和存储数据。用于标记电子文件使其具有结构性的标记语言，可以用来标记数据、定义数据类型、是一种允许用户对自己的标记语言进行定义的源语言。XML使用DTD文档类型定义来组织数据；格式统一，跨平台和语言，早已成为业界公认的标准。
    	json定义                              
    	json一种轻量级的数据交换格式，具有良好的可读性和便于快速编写的特性。可在不同平台之间进行数据交换。json采用兼容性很高的、完全独立与语言文本格式，同时也具备类似于c语言\以及java、python等等体系的习惯。这些使得JSON成为理想的数据交换语言。
    
    	xml：可扩展标记语言，是一种用于标记电子文件使其具有结构性的标记语言。
    	json：(JavaScript Object Notation, JS 对象简谱) 是一种轻量级的数据交换格式。
    	二者区别：
    	它们都是一种数据交换格式。
    	1，xml是重量级的，json是轻量级的。
    	2，xml在传输过程中比较占带宽，json占带宽少，易于压缩。
    	3，xml和json都用在项目交互下，xml多用于做配置文件，json用于数据交互。
    	4，json可用jackson，gson等方法解析，xml可用dom，sax，demo4j等方式解析。