WEB前端面试总结

最近出去面试，写一下一些被问的东西，并且总结下自己

一、web标准以及语义化是什么,一些头部标签的意义
1.Web标准是一系列的标准，网页主要分为结构，表现，行为，相应的标准也是为3个，结构化标准主要包括xhtml和xml；表现标准主要指css，行为标准主要包括对象模型（如W3C DOM）、ECMAScript等。
2.所谓 web 语义化，从广义上来说，不仅要使机器（搜索引擎等）易于理解，也要使人易于理解。
举例h5标签：

,

,

,

,

,

,

(之前的标签)等

Content-type 定义网络文件以及网页的编码，决定浏览器将用什么格式，什么编码读取文件
Cache-Control 请求和响应遵循的缓存机制
[1] no-cache ---- 不要读取缓存中的文件，要求向WEB服务器重新请求
[1] no-store ---- 请求和响应都禁止被缓存
[2] max-age： ---- 表示当访问此网页后的max-age秒内再次访问不会去服务器请求，其功能与Expires类似，只是Expires是根据某个特定日期值做比较。一但缓存者自身的时间不准确.则结果可能就是错误的，而max-age,显然无此问题.。Max-age的优先级也是高于Expires的

二、浏览器输入地址后会执行哪些操作？以及一些衍生问题（网络状态，跨域，请求类型等）
1.浏览器查找域名的IP地址;
2.浏览器给web服务器发送一个HTTP请求;
3.服务的永久重定向响应;
4.浏览器跟踪重定向地址;
5.服务器“处理”请求;
6.服务器发回一个HTML响应;
7.浏览器开始显示HTML;
8.浏览器发送获取嵌入在HTML中的对象;
========================================================================
========================================================================
此时会涉及到网络请求状态
比较常见的状态：
2xx （成功）
200 （成功） 服务器已成功处理了请求。 通常，这表示服务器提供了请求的网页。
3xx （重定向）
没有碰到过，具体不清楚
4xx（请求错误）
400 （错误请求） 服务器不理解请求的语法。
401 （未授权） 请求要求身份验证。 对于需要登录的网页，服务器可能返回此响应。
403 （禁止） 服务器拒绝请求。
404 （未找到） 服务器找不到请求的网页。
405 （方法禁用） 禁用请求中指定的方法。
5xx（服务器错误）
500 （服务器内部错误） 服务器遇到错误，无法完成请求。
503 （服务不可用） 服务器目前无法使用（由于超载或停机维护）。 通常，这只是暂时状态。
========================================================================
========================================================================
还有被到请求必定会问你跨域的解决方案：
首先讲一下什么是跨域，为什么会出现跨域问题：
跨域指一个域下的文档或脚本试图去请求另一个域下的资源
跨域问题是由于javascript语言安全限制中的同源策略造成的,简单来说,同源策略是指一段脚本只能读取来自同一来源的窗口和文档的属性,这里的同一来源指的是主机名、协议和端口号的组合.
一般常见的主要指：（脚本请求） js发起的ajax请求、dom和js对象的跨域操作等
常用的解决方案：
1.jsonp 需要目标服务器配合一个callback函数。
2.CORS 需要服务器设置header ：Access-Control-Allow-Origin。
3.nginx反向代理（我没有做过，至少比不知道好）
总之都是需要服务端配合解决
========================================================================
========================================================================
请求类型常见分为4种：get post put delete
get post的区别
从传输数据大小，post大于get
从安全性方面，post安全与get，主要是get通过url直接能看到，虽然post也能在F12里看到，都是明文，然而get会保存在浏览器历史记录中
还有个幂等，不太了解
========================================================================
========================================================================
回来说下页面渲染的问题，一般会问页面渲染是否是从上到下，具体的过程也要稍微了解下
HTML解析出DOM Tree
CSS解析出Style Rules
将二者关联生成Render Tree
Layout 根据Render Tree计算每个节点的信息
Painting 根据计算好的信息绘制整个页面
对于script标签放在head里和body里的区别
如果把javascript放在head里的话，则先被解析,但这时候body还没有解析。有可能会出现执行了方法但没办法获取body里对象的情况，一般都会写个

$(document).ready(function(){  
//make your code
})  

除此之外，从JavaScript对页面下载性能方向考虑：由于脚本会阻塞其他资源的下载（如图片等）和页面渲染，直到脚本全部下载并执行完成后，页面的渲染才会继续，因此推荐将所有的