web前端面试笔试题

1、如何解决跨域 通过jsonp跨域 通常为了减轻web服务器的负载，我们把js、css，img等静态资源分离到另一*立域名的服务器上，在html页面中再通过相应的标签从不同域名下加载静态资源，而被浏览器允许，基于此原理，我们可以通过动态创建script，再请求一个带参网址实现跨域通信。 1.）原生实现：

服务端返回如下（返回时即执行全局函数）： onBack({"status": true, "user": "admin"}) 2.）jquery ajax： http.jsonp('http://www.domain2.com:8080/login', { params: {}, jsonp: 'onBack' }).then((res) => { console.log(res); })

2、简述ajax流程 1.建立xmlHttpRequest对象

if(window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
if(xmlHttp.overrideMimeType) {
 xmlHttp.overrideMimeType("text/xml");
}
复制代码

} else if(window.ActiveXobject) { var activeName = ["MSXML2.XMLHTTP", "Microsoft.XMLHTTP"]; for(var i = 0; i < activeName.length; i++) { try { xmlHttp = new ActiveXobject(activeName[i]); break; } catch(e) {} } } if(!xmlHttp) { alert("创建xmlhttprequest对象失败"); } else {}

2.设置回调函数

xmlHttp.onreadystatechange= callback;

function callback(){}

3.使用OPEN方法与服务器建立连接 xmlHttp.open("get","ajax?name="+ name,true)

此步注意设置http的请求方式（post/get）,如果是POST方式，注意设置请求头信息xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded")

4.向服务器端发送数据

xmlHttp.send(null);

如果是POST方式就不为空

5.在回调函数中针对不同的响应状态进行处理

if(xmlHttp.readyState == 4){ //判断交互是否成功

  if(xmlHttp.status == 200){         //获取服务器返回的数据         //获取纯文本数据

    var responseText =xmlHttp.responseText;

   document.getElementById("info").innerHTML = responseText;

  }
复制代码

}