2019春招前端面试总结（jQuery篇）

是什么

jQuery是一个轻量级的js库。

理念：写得少，做得多。

优点：（1）轻量级 （2）强大的选择器 （3）出色的DOM操作的封装

1. 可靠的事件处理机制 （5）完善的Ajax  （6）不污染顶级变量

1. 出色的浏览器兼容性 （8）链式操作方式 （9）隐式迭代

1. 行为层与结构层的分离 （11）丰富的插件支持

（12）完善的文档 （13）开源

 

 

1. $()是什么

就是一个jQuery的简写形式

有几种选择器

基本选择器

层次选择器：空格 所有后代   > 所有子元素    +紧接的一个元素   ~所有兄弟元素

过滤选择器

表单选择器

$(document).ready() 和 window.onload有什么区别

	$(document).ready()	Window.onload
执行时间	网页中所有DOM结构绘制完毕后就执行，可能DOM关联的东西并没有加载完	必须等网页中内容（包括图片）加载完毕后才能执行
编写个数	能同时编写多个	不能同时编写多个，只运行最后一个
简化写法	$(function(){     //... })	无

 

写一个简单的$.ajax()的请求方式

jQuery对Ajax进行了封装，在jQuery中$.ajax()方法属于最底层的方法，第2层是load()、$.get()和$.post()，第3层是$.getScript()和$.getJSON()方法。

load(url, [,data],[,callback]) ：

·能远程载入html代码插入到DOM中  load(“test.html”)

·筛选载入的HTML文档 load(“test.html .para”)

·传递方式 没有参数为GET，否则为POST

·回调函数 function(请求返回的内容，请求状态，XMLHttpRequest对象){...}

$.get()和$.post()

$.get(url [ ,data] [ ,callback] [ ,type])

Data: k/v

Callback: function(返回内容data,请求状态textStatus){...}

Type：服务器端返回的内容格式：xml、html、json...

$.getScript()和$.getJSON()

$.getScript(“color.js”,function(){....})

$.getJSON(“test.json”,function(data){ //data为返回的数据...})   JSONP

$.ajax(options) 一个参数，以k/v形式存在

{

Url: 发送请求的地址,

Type: 请求方式（GET/POST）,

Data: 发送到服务器的数据,

dataType: 预期服务器返回数据的类型(XML/HTML/JSON/SCRIPT/JSONP/...),

beforeSend：发送请求前可以修改XMLHttpRequest对象的函数(Function),

Complete: 请求完成后调用的回调函数,

Success: 请求成功后调用的回调函数（function(data,textStatus){//....}）,

Error: 请求失败后调用的回调函数（function(XMLHttpRequest,textStatus,

errorThrow){}）,

Global: 是否触发全局Ajax函数(true/false)

}

Ajax的优缺点和工作原理

是什么：

异步JavaScript和XML，是一种用于快速创建动态网页的技术，他最大的优点是不需要加载整个网页，便可与服务器进行数据交换实现部分网页刷新。

优势：1.不需要插件支持

1. 优秀的用户体验：能在用户不刷新整个页面的前提下更新数据
2. 提高Web程序的性能：Ajax模式只是通过XmlHttpRequest对象像服务器端提交希望的数据，即按需发送。
3. 减轻服务器和宽带的负担

不足：1.浏览器对XMLHttpRequest对象的支持度不高

1. 破坏浏览器前进、“后退”按钮的正常功能
2. 对搜素引擎的支持不足
3. 开发和调试工具的缺乏