前端经典面试题2

5.一次完整的HTTP事务是怎样的一个过程？
6.你所了解到的Web攻击技术?
7.ajax是什么?ajax的交互模型?同步和异步的区别?如何解决跨域问题?
8.什么叫优雅降级和渐进增强？

思考题
3、前端网页制作怎么克服不同分辨率的问题？
4、是否该继续使用 < b>和 < i> 两个标签?

5.一次完整的HTTP事务是怎样的一个过程？
域名解析 –> 发起TCP的3次握手 –> 建立TCP连接后发起http请求 –> 服务器响应http请求，浏览器得到html代码 –> 浏览器解析html代码，并请求html代码中的资源（如js、css、图片等） –> 浏览器对页面进行渲染呈现给用户。

6.你所了解到的Web攻击技术?
（1）XSS（Cross-Site Scripting，跨站脚本攻击）：指通过存在安全漏洞的Web网站注册用户的浏览器内运行非法的HTML标签或者JavaScript进行的一种攻击。
（2）SQL注入攻击
（3）CSRF（Cross-Site Request Forgeries，跨站点请求伪造）：指攻击者通过设置好的陷阱，强制对已完成的认证用户进行非预期的个人信息或设定信息等某些状态更新

7.ajax是什么?ajax的交互模型?同步和异步的区别?如何解决跨域问题?
AJAX全称为“AsynchronousJavaScript and XML”（异步JavaScript和XML），是一种创建交互式网页应用的网页开发技术。
基本思想是允许一个互联网浏览器向一个远程页面/服务做异步的http调用，并且用收到的数据来更新一个当前web页面而不必刷新整个页面。该技术能够改进客户端的体验。

1. 通过异步模式，提升了用户体验
2. 优化了浏览器和服务器之间的传输，减少不必要的数据往返，减少了带宽占用
3. Ajax在客户端运行，承担了一部分本来由服务器承担的工作，减少了大用户量下的服务器负载。
   Ajax的特点
   Ajax可以实现动态不刷新（局部刷新）
   readyState属性 状态 有5个可取值： 0=未初始化 ，1=启动 2=发送，3=接收，4=完成

ajax的缺点
1、ajax不支持浏览器back按钮。
2、安全问题 AJAX暴露了与服务器交互的细节。
3、对搜索引擎的支持比较弱。
4、破坏了程序的异常机制。
5、不容易调试。

同步：脚本会停留并等待服务器发送回复然后再继续
异步：脚本允许页面继续其进程并处理可能的回复
跨域问题简单的理解就是因为JS同源策略的限制，a.com域名下的JS无法操作b.com或c.a.com下的对象

前端对于跨域的解决办法：
(1) document.domain+iframe
(2) 动态创建script标签
参考文献：

来自 https://zhuanlan.zhihu.com/p/27879875

来自 http://blog.csdn.net/chenmoquan/article/details/38560649

来自 http://www.cnblogs.com/hsp09/articles/3479348.html

8.什么叫优雅降级和渐进增强？
渐进增强 progressive enhancement：针对低版本浏览器进行构建页面，保证最基本的功能，然后再针对高级浏览器进行效果、交互等改进和追加功能达到更好的用户体验。
优雅降级 graceful degradation：一开始就构建完整的功能，然后再针对低版本浏览器进行兼容。
区别：
a. 优雅降级是从复杂的现状开始，并试图减少用户体验的供给
b. 渐进增强则是从一个非常基础的，能够起作用的版本开始，并不断扩充，以适应未来环境的需要
c. 降级（功能衰减）意味着往回看；而渐进增强则意味着朝前看，同时保证其根基处于安全地带

来自 http://www.cnblogs.com/bigboyLin/p/5272902.html

前端思考题
3、前端网页制作怎么克服不同分辨率的问题？
根据屏幕不同大小，缩小窗口出横向滚动条在所难免，但理想情况下，页面应该能适应不同客户端浏览器和分辨率。实际操作通常又有三种情况：版面自适应、视觉自适应、内容自适应。

还可以使用rem 或者响应式布局

px和rem的区别：
px是绝对值，rem相对值，比如我们把根元素的front-size设置成16px, 那么2rem就是32px，根元素的front-size设置成32px, 那么2rem就是64px。

4、是否该继续使用 < b>和 < i> 两个标签?
< b>和 < i> 标签不应该用于修饰文字的式样，这些视觉的修饰应该交由 CSS 处理。如果要强调一个词汇或语句，应该使用< strong> 或 < em> 标签。只有在那些没有别的标签可用的场合，才可以考虑 < b>和 < i> 。