目前前端开发涉及的技术比较多,从最基本的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内核)
【热门前端开发面试题及答案汇总(一)(HTML经典面试题和答案分析)】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]-->
推荐阅读
- 热门前端开发面试题之CSS面试题和答案分析
- 如何在一个JavaScript文件中包含另一个JavaScript文件(有哪几种方式?)
- event.preventDefault() vs. return false这两种调用方式有什么区别()
- 如何在JavaScript中实现复制到剪贴板(如何原生实现,有第三方库吗?)
- 如何重新随机化或者重新排序JavaScript的数组元素()
- JavaScript如何将现有的回调API转为promise(有示范实例吗?)
- PHP | Ds Vector __construct()函数用法介绍
- JavaScript中的箭头函数用法指南
- Scala中的变量用法介绍