经常在网上看到刚刚毕业就能到BAT等大公司工作，或者工作一年甚至比工作三五年经验还要丰富的人讲述自己的面试经验，工作经历。为此，我苦恼过，怀疑过，对于自己这种不是名牌大学毕业，没有那种高大上的实习经历，甚至是偶然的机会接触前端，才对前端起了兴趣的人来说，未来到底有没有希望？我能否成为一名合格甚至高端的前端工程师？但是我觉得这种问题靠想是不会有答案的，我决定要通过自己的努力来证明，起步高并不能代表一切。喜欢就去做，哪怕开始的路会特别坎坷艰难！
为此，我想把学习的过程和收获记录下来，一步一步的看着自己成长。这其中有我自己的学习总结，也有借鉴的知识，汇总下来，以面试题的形式写进我的博客里。我会坚持写下去，并且希望有志同道合的小伙伴能督促我，陪我一起走下去。如果我有哪里写错了，也请能帮我指出来。
1. 主流的浏览器都有哪些？内核分别是什么？
答：（1）浏览器：谷歌（chrome），火狐（Firefox），IE，欧朋（opera），苹果（safari）
（2）内 核：blink(谷歌/欧朋)，gecko（火狐），trident（IE），webkit（苹果）
注：(1)2013年4月3日，谷歌对外宣布，停止使用webkit作为chrome浏览器的渲染引擎，但是webkit并不会被马上淘汰，而是作为全新渲染引擎”blink”的后台技术。Blink对于webkit来说，精简了代码，在针对DOM框架上更友善，安全性也有所提升。（webkit由谷歌，苹果，Adobe共同开发推动，blink是webkit的升级版）
(2)浏览器内核分为两个部分：1渲染引擎：负责生成DOM树，render，repaint等工作；2js引擎：负责js的解释执行。（渲染引擎是兼容性出现的根本原因）。
2. 前端页面由哪三层构成？其作用分别是什么？
答：（1）结构层（html/超文本标记语言）：从语义的角度搭建网页结构；
（2）表示层（css/层叠式样式表）： 从装饰的角度美化页面；
（3）行为层（javascript）：从交互的角度描述我们的页面行为。
注：什么是web语义化：用含有语义的标签来描述页面结构。
3. 为什么要语义化？基于此，在写页面结构的时候要注意什么？
答：3.1(1)在没有css代码时也可呈现出很好的内容结构，代码结构清晰既可以提高用户体验，也更方便机器读懂代码；
(2)方便其他设备解析（如屏幕阅读器、盲人阅读器等以语义的方式渲染页面；
(3)利于SEO优化，语义能和搜索引擎建立良好的联系，有利于爬虫获取信息；
(4)便于团队开发和维护（可以让开发者快速的熟悉代码，使得工作交接更方便），语义化更具有可读性（遵循W3C标准规范化）；
3.2(1)尽可能少的使用没有语义的（如div）元素;
(2)在对语义要求不明显时，尽量使用有语义的标签（div和p时，尽量使用p，因为p有默认样式，可以兼容不同终端）;
(3)不要使用纯样式标签（如b，font等），要用css设置样式;
(4)使用表格时，标题要用caption，表头thead，等;
4. Html5骨架
<!DOCTYPE html> <!—DTD文档：定义文档类型--> <html> <!—html树--> <head lang=”en”> <!—页面的头部：语言类型英语--> <meta charset=”UTF-8”> <!—定义字符集UTF-8(国际通用)>gbk(中文)--> <title>web前端</title> <!—页面的标题，有助于seo优化--> </head> <body></body> <!—页面的主体部分--> </html>
注：html版本：(1)strict：严格版，不允许使用废弃标签;
(2)transitional：过度版，可以使用一些废弃标签b,u,i来制作css里的钩子
(标签必须小写，属性值必须用双引号包裹，结束标签必须有”/”);
(3)frameset:框架 。
5. DOCTYPE是什么，有什么作用？
答：(1)DOCTYPE：Document Type Declaration（文档类型声明，缩写 DTD）。一般位于一个HTML文档的最前面（根元素的起始标签）之前。
(2)用来确定当前文档的类型，以决定需要采用的渲染模式（不同的渲染模式会影响到浏览器对于css甚至jsjavaScript脚本的解析）。DOCTYPE不存在或形式不正确会导致HTML文档以混杂模式呈现(混杂模式不可取，完全没有兼容可言)。
6. HTML5为什么只需要写 <!DOCTYPE HTML>？
答：(1)HTML5不基于SGML（Standard Generalized Markup Language 标准通用标记语言），因此不需要对DTD（DTD 文档类型定义）进行引用，但是需要DOCTYPE来规范浏览器行为。
(2)HTML4.01基于SGML，所以需要引用DTD。才能告知浏览器文档所使用的文档类型，如下：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
7. HTML5有哪些新特性,移除了那些元素？如何处理HTML5新标签的浏览器兼容问题？
答：新增元素：
(1)canvas
(2)用于媒介回放的video和audio元素
(3)本地离线存储。localStorage长期存储数据，浏览器关闭后数据不丢失;sessionStorage的数据在浏览器关闭后自动删除
(4)语意化更好的内容元素，比如 article footer header nav section
(5)位置API：Geolocation
(6)表单控件，calendar date time email url search
(7)新的技术：web worker(web worker是运行在后台的 JavaScript，独立于其他脚本，不会影响页面的性能。您可以继续做任何愿意做的事情：点击、选取内容等等，而此时 web worker 在后台运行) web socket
(8)拖放API：drag、drop
移除的元素：
纯表现的元素：basefont 、big 、center 、font 、s 、strike、tt、u
性能较差元素：frame、 frameset 、noframes
兼容性问题：
(1)使用html5shim：在<head>中调用以下代码：
<!--[if lt IE 9]>
<script> src="http://html5shim.googlecode.com/svn/trunk/html5.js"</script>
<![endif]-->
<!--[if lt IE 9]> <script> src="http://html5shim.googlecode.com/svn/trunk/html5.js"</script> <![endif]-->(2)使用kill IE6：在</body>之前调用以下代码：
<!--if lte IE 6]>
<script src="http://letskillie6.googlecode.com/svn/trunk/letskillie6.zh_CN.pack.js"></script>
<![endif]-->
<!--if lte IE 6]> <script src="http://letskillie6.googlecode.com/svn/trunk/letskillie6.zh_CN.pack.js"></script> <![endif]-->8.关于meta标签的seo优化：
答：(1) 查找关键字：<meta name=”keywords” content=”关键字”>
(2) 网页描述：<meta name=”description” content=”描述内容”>
持续更新补充中。。。
随时随地看视频
