srcmini目前前端开发涉及的技术比较多，从最基本的HTML、CSS到React和Vue.js等，作为一名合格的前端工程师，需要掌握的技术并不比后端少甚至还多，最基本的技术是HTML+CSS+JavaScript，基本要掌握的内容有：
浏览器基本原理（可查看浏览器运行机制分析）、hack、兼容性、HTML5、基本CSS布局和盒子模型、选择器、CSS3、高级响应式布局（响应式布局教程和实例），对于JavaScript需要掌握的内容有：
JS基本数据类型和语句等基本内容、面向对象编程、继承（JavaScript继承原理和实例分析）、跨域、作用域（JavaScript上下文运行机制分析）、原型链（JavaScript原型和原型链）、事件、事件循环机制（JavaScript事件循环、队列和执行栈）、ajax、模板、Node.js等。
可以看到关于JavaScript的内容相当复杂，其中的核心内容继承、作用域、原型链和事件循环相对较难，可参考JavaScript基础入门教程获取更多内容，本节主要先讨论HTML的经典面试题及其答案分析。
一、简单说下HTML文档中DOCTYPE的作用
<!DOCTYPE>声明在HTML文档的顶部，在<html>标签之前，它的意思是告诉浏览器的解析器使用什么文档规范解析该文档。如果DOCTYPE不存在或格式不正确，则会导致HTML文档显示异常。
二、什么是行内元素和块级元素？行内元素和块级元素分别有哪些？空元素有哪些？
在CSS中，元素的display属性指定该元素的类型，每个元素都有其自身的display默认值，例如div和h元素的默认值为block，称为块级元素，行内元素的display属性默认值为inline。
常见的块级元素有：div、h1-h6、p、li、dd、dt、table、form等
常见的行内元素有：a、span、b、strong、img、i、input等
空元素有：br、hr、area、base、input、link、meta等
三、流行的浏览器内核分别是什么？NodeJS使用的JS引擎是哪个？
IE浏览器内核：Trident
Chrome浏览器内核：Blink（WebKit内核）
Mozilla浏览器内核：Gecko
Opera浏览器内核：Blink
NodeJS使用的JS引擎为V8引擎
四、HTML页面布局需要注意哪些兼容性问题？
IE6使用PNG24位图片出现背景，解决方案是使用PNG8
Chrome下小于12px的中文字体强制按12px显示，通过CSS的-webkit-text-size-adjust:none解决
IE浮动距离变大的问题，解决为{float:left;width:10px;margin:0 0 0 100px}
五、阿里面试题：如何实现浏览器内多个标签页数据通信？
使用cookies、localstorge等本地存储方式
六、阿里面试题：websocket如何兼容低版本的浏览器？
使用Adobe Flash Socket、ActiveX HTMLFile（IE）、基于multipart编码发送XHR、基于长轮询的XHR
七、HTML本地存储有哪些方式？
LocalStorage：长期存储数据，关闭浏览器数据仍然保存
SessionStorage：数据在浏览器关闭后自动删除
Cookie：保存少量数据，可设置过期时间。
八、如何让浏览器支持HTML5？
使用html5sim框架，如下添加到head标签中：
<!--[if lt IE 9]>
<script> src="http://html5shim.googlecode.com/svn/trunk/html5.js"</script>
<![endif]-->
评论前必须登录！
注册