1. 前端面试的H5问题有哪些
前端面试的H5问题汇总：
1.HTML5 为什么只需要写 <!DOCTYPE HTML>？
答案解析：
HTML5不基于SGML，因此不需要对DTD进行引用，但是需要DOCTYPE来规范浏览器的行为（让浏览器按照他们应该的方式来运行）而HTML4.01基于SGML，所以需要对DTD进行引用，才能告知浏览器文档所使用的文档类型。
2、行内元素有哪些？块级元素有哪些？ 空(void)元素有那些？
答案解析：
行内元素：a b span img input select strong
块级元素：div ul ol li dl dt dd h1 h2 h3 h4 p 等
空元素：<br> <hr> <img> <link> <meta>
3、页面导入样式时，使用link和@import有什么区别？
答案解析：
1）link属于XHTML标签，而@import是css提供的；
2）页面被加载时，link会同时被加载，而@import引用的css会等到页面被加载完再加载；
3）@import只在IE5以上才能识别，而link是XHTML标签，无兼容问题；
4）link方式的样式的权重高于@import的权重。
4、html5有哪些新特性、移除了那些元素？如何处理HTML5新标签的浏览器兼容问题？
答案解析：
新特性，新增元素：
1）内容元素：article、footer、header、nav、section
2）表单控件：calendar、date、time、email、url、search
3）控件元素：webworker，websockt，Geolocation
移除元素：
1）显现层元素：basefont，big，center，font，s，strike，tt，u
2）性能较差元素：frame，frameset，noframes
处理兼容问题有两种方式：
1）IE6/IE7/IE8支持通过document方法产生的标签，利用这一特性让这些浏览器支持HTML5新标签。
2）使用是html5shim框架
另外，DOCTYPE声明的方式是区分HTML和HTML5标志的一个重要因素，此外，还可以根据新增的结构，功能元素来加以区分。
5、如何区分 HTML 和 HTML5？
答案解析：
1）在文档类型声明上不同：
HTML是很长的一段代码，很难记住，而HTML5却只有简简单单的声明，方便记忆。
2）在结构语义上不同：
HTML：没有体现结构语义化的标签，通常都是这样来命名的<div id="header"></div>，这样表示网站的头部。
HTML5：在语义上却有很大的优势。提供了一些新的标签，比如：<header><article><footer>
6、简述一下你对HTML语义化的理解？
答案解析：
1）用正确的标签做正确的事情；
2）html语义化让页面的内容结构化，结构更清晰，便于对浏览器、搜索引擎解析；
3）即使在没有样式css情况下也以一种文档格式显示，并且是容易阅读的；
4）搜索引擎的爬虫也依赖于HTML标记来确定上下文和各个关键字的权重，利于SEO；
5）使于都源代码的人对网站更容易将网站分块，便于阅读维护理解。
7、HTML5的离线储存怎么使用，工作原理能不能解释一下？
答案解析：
localStorage 长期存储数据，浏览器关闭后数据不丢失；
sessionStorage 数据在浏览器关闭后自动删除。
8、iframe有那些缺点？
答案解析：
1）在网页中使用框架结构最大的弊病是搜索引擎的“蜘蛛”程序无法解读这种页面；
2）框架结构有时会让人感到迷惑，页面很混乱；
9、Doctype作用? 严格模式与混杂模式如何区分？它们有何意义?
答案解析：
1）<!Doctype>声明位于文档中的最前面，处于<html>标签之前。告知浏览器的解析器，用什么文档类型规范来解析这个文档。
2）严格模式的排版和JS运作模式是以该浏览器支持的最高标准运行。
3）在混杂模式中，页面以宽松的向后兼容的方式显示。模拟老式浏览器的行为以防止站点无法工作。
4）DOCTYPE不存在或格式不正确会导致文档以混杂模式呈现。
10、常见兼容性问题？
1）png24位的图片在IE6浏览器上出现背景；
解决方案是：做成PNG8；
2）浏览器默认的 margin 和 padding 不同。
解决方案是：加一个全局的*{margin:0;padding:0;}来统一。
3）IE6双边距bug：块属性标签float后，又有横行的 margin 情况下，在 IE6 显示 margin 比设置的大。浮动IE产生的双倍距离 #box{float:left;width:10px;margin:0 0 0 100px;} 这种情况下IE6会产生200px的距离。
解决方法：加上_display：inline，使浮动忽略
4）IE下，可以使用获取常规属性的方法来获取自定义属性，也可以使用getAttribute()获取自定义属性； Firefox下，只能使用getAttribute()获取自定义属性。
解决方法：统一通过getAttribute()获取自定义属性。
5）IE下，even对象有x，y属性，但是没有pageX，pageY属性，但是没有x，y属性；
解决方法：（条件注释）缺点是在IE浏览器下可能会增加额外的HTTP请求数。
6）Chrome中文界面下默认会将小于 12px 的文本强制按照 12px 显示
解决方法：可通过加入 CSS 属性 -webkt-text-size-adjust:none;解决
7）超链接访问过后 hover 样式就不出现了，被点击访问过的超链接样式不在具有 hover 和 active ；
解决方法：改变CSS属性的排列顺序：L-V-H-A: a:link{ } a:visited{ } a:hover{ } a:active{ }
11、如何实现浏览器内多个标签页之间的通信？
答案解析：
调用localstorge、cookies等本地存储方式
12、webSocket如何兼容低浏览器？
答案解析：
Adobe Flash Socket 、 ActiveX HTMLFile (IE) 、 基于 multipart 编码发送 XHR 、 基于长轮询的 XHR
13、支持HTML5新标签
答案解析：
1）IE8/IE7/IE6支持通过 document.createElement 方法产生的标签，可以利用这一特性让这些浏览器支持 HTML5 新标签，浏览器支持新标签后，还需要添加标签默认的样式；
2）当然最好的方式是直接使用成熟的框架、使用最多的是 html5shim 框架
<!--[if lt IE 9]>
<script> src="http://html5shim.googlecode.com/svn/trunk/html5.js"</script>
<![endif]-->
14、如何区分：DOCTYPE 声明\新增的结构元素\功能元素，语义化的理解？
答案解析：
1）用正确的标签做正确的事情；
2）html语义化就是让页面的内容结构化，便于对浏览器、搜索引擎解析；
3）在没有样式 CSS 情况下也以一种文档格式显示，并且是容易阅读的；
4）搜索引擎的爬虫依赖于标记来确定上下文和各个关键字的权重，利用 SEO ；
5）使阅读源代码的人对网站更容易将网站分块，便于阅读维护理解。
15、介绍一下 CSS 的盒子模型？
答案解析：
1）有两种，IE 盒子模型、标准 W3C 盒子模型； IE 的 content 部分包含了 border 和 padding；
2）盒模型：内容（content）、填充（padding）、边界（margin）、边框（border）。
16、CSS 选择符有哪些？哪些属性可以继承？优先级算法如何计算？ CSS3 新增伪类有哪些？
答案解析：
1）id 选择器（#myid）
2）类选择器（.myclassname）
3）标签选择器（div，h1，p）
4）相邻选择器（h1 + p）
5）子选择器（ul > li）
6）后代选择器（li a）
7）通配符选择器（* ）
8）属性选择器（ a[rel = "external"]）
9）伪类选择器（a: hover, li: nth - child）
17、可继承的样式： font-size font-family color, UL LI DL DD DT
18、不可继承的样式：border padding margin width height
19、优先级就近原则，同权重情况下样式定义最近者为准
20、载入样式以最后载入的定位为准;
解析答案：优先级为: !important > id > class > tag ； important 比 内联优先级高
21、CSS3新增伪类举例：
答案解析：
p:first-of-type 选择属于其父元素的首个 <p> 元素的每个 <p> 元素；
p:last-of-type 选择属于其父元素的最后 <p> 元素的每个 <p> 元素；
p:only-of-type 选择属于其父元素唯一的 <p> 元素的每个 <p> 元素；
p:only-child 选择属于其父元素的唯一子元素的每个 <p> 元素；
p:nth-child(2) 选择属于其父元素的第二个子元素的每个 <p> 元素；
:enabled :disabled 控制表单控件的禁用状态；
:checked 单选框或复选框被选中。
22、如何居中div？ 如何居中一个浮动元素？
答案解析：
给div 设置一个宽度，然后添加 margin:0 auto 属性；div{width:200px; margin:0 auto; }
23、居中一个浮动元素
答案解析：
确定容器的宽高 宽500 高300的层，设置层的外边距
.div{width:500px;height:300px;margin:-150px 0 0 -250px;position:relative;background:green；left：50%；头：50%}
24、css3有哪些新特性？
答案解析：
CSS3 实现圆角（border-radius:8px;），阴影（box-shadow:10px）,对文字加特效（text-shadow）,线性渐变（gradient），旋转（transform）
transform:rotate(9deg) scale(0.85,0.90) translate(0px,-30px) skew(-9deg,0deg);//旋转，缩放，定位，倾斜
增加了更多的 css 选择器 多背景 rgba
25、为什么要初始化 CSS 样式
答案解析：
因为浏览器的兼容问题，不同浏览器对有些标签的默认值是不同的，如果没对 CSS 初始化往往会出现浏览器之间的页面显示差异。
当然，初始化样式会对 SEO 有一定的影响，但鱼和熊掌不可兼得，但力求影响最小的情况下初始化。
最简单的初始化方法是：*{padding:0;margin:0} (不建议)
淘宝的样式初始化：
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input,
textarea, th, td { margin:0; padding:0; }
body, button, input, select, textarea { font:12px/1.5tahoma, arial, \5b8b\4f53; }
h1, h2, h3, h4, h5, h6{ font-size:100%; }
address, cite, dfn, em, var { font-style:normal; }
code, kbd, pre, samp { font-family:couriernew, courier, monospace; }
small{ font-size:12px; }
ul, ol { list-style:none; }
a { text-decoration:none; }
a:hover { text-decoration:underline; }
sup { vertical-align:text-top; }
sub{ vertical-align:text-bottom; }
legend { color:#000; }
fieldset, img { border:0; }
button, input, select, textarea { font-size:100%; } table { border-collapse:collapse; border-spacing:0; }
26、display:inline-block 什么时候会显示间隙？
答案解析：
移除空格，使用margin 负值、使用 font-size:0、letter-spacing 、word-spacing
27、使用 CSS 预处理器吗？喜欢哪个？
答案解析：SASS
28、什么是盒子模型？
答案解析：
在网页中，一个元素占有空间的大小由几个部分构成，其中包括元素的内容（content），元素的内边距（padding），元素的边框（border），元素的外边距（margin）四个部分。这四个部分占有的空间中，有的部分可以显示相应的内容，而有的部分只用来分隔相邻的区域或区域。4个部分一起构成了css中元素的盒模型。
29、CSS实现垂直水平居中
答案解析：
一道经典的问题，实现方法有很多种，以下是其中一种实现：
HTML结构：
<divclass="wrapper">
<divclass="content"></div>
</div>
CSS：
.wrapper{position:relative;}
.content{
background-color:#6699FF;
width:200px;
height:200px;
position:absolute; //父元素需要相对定位
top:50%;
left:50%;
margin-top:-100px; //二分之一的height，width
margin-left:
-100px;
}
30、简述一下src与href的区别
答案解析：
href 是指向网络资源所在位置，建立和当前元素（锚点）或当前文档（链接）之间的链接，用于超链接。
src是指向外部资源的位置，指向的内容将会嵌入到文档中当前标签所在位置；在请求src资源时会将其指向的资源下载并应用到文档内，例如js脚本，img图片和frame等元素。当浏览器解析到该元素时，会暂停其他资源的下载和处理，直到将该资源加载、编译、执行完毕，图片和框架等元素也如此，类似于将所指向资源嵌入当前标签内。这也是为什么将js脚本放在底部而不是头部。
31、简述同步和异步的区别
答案解析：
同步是阻塞模式，异步是非阻塞模式。
同步就是指一个进程在执行某个请求的时候，若该请求需要一段时间才能返回信息，那么这个进程将会一直等待下去，直到收到返回信息才继续执行下去；
异步是指进程不需要一直等下去，而是继续执行下面的操作，不管其他进程的状态。当有消息返回时系统会通知进程进行处理，这样可以提高执行的效率。
32、px和em的区别
答案解析：
px和em都是长度单位，区别是，px的值是固定的，指定是多少就是多少，计算比较容易。em得值不是固定的，并且em会继承父级元素的字体大小。
浏览器的默认字体高都是16px。所以未经调整的浏览器都符合: 1em=16px。那么12px=0.75em, 10px=0.625em
33、浏览器的内核分别是什么?
答案解析：
IE: trident内核
Firefox：gecko内核
Safari：webkit内核
Opera：以前是presto内核，Opera现已改用Google Chrome的Blink内核
Chrome：Blink(基于webkit，Google与Opera Software共同开发)
2. 前端小知识点(从一名小白到前端大神需要掌握哪些知识点)
1.从一名小白到前端大神需要掌握哪些知识点
要想被称为前端大神要掌握的知识点还是有点多的，以我在源码时代培训过的经验来看，要想成为顶尖的前端大神，以下知识点你至少是应该要掌握的：“JavaScript基础、HTML入门基本内容，CSS+DIV的基础知识，选择器，盒子模型，网页布局，Photoshop,JavaScript高级编程，jQuery插件开发，模块化组件开，AJAX,HTML5,CSS3，响应式原理及布局，Bootstrap，前端依赖管理，CSS预处理语言（Less+Sass）,Grunt/Gulp自动化构建工具Express(Node.js),MongoDB,ElementUIl,MVC、MVVM架构模式，VUE2,Webpack模块加载器&打包工具，React,Angular4,React Native”是不是感觉很多？觉得多就对了，只有对上述内容做到系数掌握，你才有资格被称之为“前端大神”。
2.学习前端HTML5需要了解哪些知识点
Stylus/Less实现CSS预编译
Express实现服务器端搭建
Nginx实现服务器反向代理
ngrok实现内网穿透
sha1、MD5实现加密隐私数据
Monggose实现mongoDB数据库操作
Echarts实现数据可视化
Mock、json-server实现模拟数据
Nodejs实现前后端完全分离
WebSocket实现实时通信
企业级UI设计图实现页面布局
BootStrap实现响应式页面
原生JavaScript实现小游戏开发
原生Ajax实现前后端通信
JSONP,CORS实现解决跨域
Animation实现动画
Canvas实现气泡， 钟表功能
jQuery实现备忘录项目
ArtTemplate实现模板页面复用
Viewport + Rem实现移动端适配
ViewPort实现1物理像素问题
原生JavaScript实现无缝滑屏
zepto实现移动端滑屏
Stylus/Less实现CSS预编译
Express实现服务器端搭建
Nginx实现服务器反向代理
ngrok实现内网穿透
3.网站前端开发都需要掌握哪些知识
CSS和HTML、JavaScript这是前端学习的三个语言，其中HTML是自简单，设计到代码多的就是CSS、JavaScript，入，门简单，达到初级前端水平很容易。
但是精通各种框架需要一定学习实践1、CSS和HTML刚入门的朋友，应该把重点放在 CSS和HTML基础知识的学习上。关于 CSS(3) 你需要了解以下一些知识点：web标准、HTML相关概念、HTML标签、路径相关概念、锚点及其他、表格标签、表单标签、综合案例，注册页面、CSS选择、CSS字体样、CSS外观属性、调式、CSS复合选择器、标签显示模式、CSS背景、CSS三大特性等等。
总的来讲，CSS和HTML的学习还是比较简单的。2、JavaScriptJavaScript一直都是前端工程师进步的基石， JavaScript 的理解深度决定了前端开发者的职业发展。
关于JavaScript的学习内容包括了浏览器执行JS过程、JS变量、数据类型、运算符、流程控制语句（if else 、三元表达式、switch）、循环（for、while、do while）、数组、冒泡排序、函数、作用域、预解析、对象、内置对象、简单类型和复杂类型等。只有在熟悉了JavaScript基础语法的基础上，我们才能继续深入学习前端技术。
前端需要掌握这些基本技能精通html，能够书写语意合理，结构清晰，易维护的html结构；精通css，能够还原视觉设计，并兼容业界承认的主浏览器；熟悉javascript，了解ECMAscript基础内容，掌握至少两种js框架随着web前端技术不断发展，web前端的岗位越来越多了，技术方向也有好多种，。web前端有广阔的发展空间，app、小程序、移动端、pc端等都是需要前端技术的开发支持才能够完成，技术门槛相对较低、需求量较大，薪资待遇良好。
只要是互联网端的客户界面，就需要前端来制作完成，前端开发的编程量不大，但是需要部分编程，入门简单，但是要学的深入需要一个过程。Web前端招聘岗位• 前端开发工程师、Web开发工程师、网页开发工程师、HTML开发工程师。
• H5开发工程师、移动应用开发工程师、App开发工程师、小程序开发工程师。• JS开发工程师、Vue.js开发工程师、Node.js开发工程师、前端架构师。
• 小游戏开发工程师、数据可视化开发工程师、WebGL开发工程师、WebVR开 发工程师、Web安全工程师。在互联网行业，前端有WEB前端、HTML前端等，随着互联网技术发展，就业方向也有很多。
web前端的就业方向有web架构师、web前端工程师、HTML前端开发工程师、网页设计师等等。HTML前端开发与Web前端开发不同的是，使用HTML5不仅仅可以开发前端，还有网页游戏，手机APP，使用浏览器进行3D渲染等一系列建立在HTML5标准与搭载其标准浏览器上的开发，而未来可能会有更多的功能分支并入HTML5标准。
web前端工程师这个方向是目前从事Web前端开发的主要就业方向Web架构师薪资普遍比较高，技术要求高，掌握多种技能，包括：后端技术、DBA、Platform等等，甚至包括网站优化SEO技术。数据方向数据研发这个是在Web开发的基础上用数据附能，懂可视化的一定是有前端能力的，懂hadoop的一定java要熟悉，属于Web开发的拓展方向。
大前端方向比如阿里，在大量实践rn和weex；由于公司内部安卓/ios式微，一定程度上，前端把ios和安卓收编了，统称大前端。图形学方向前端自然是与图形学有千丝万缕的联系，除了上面提到了可视化，还有相关3d引擎的开发工作。
做这一行要求也非常高了，图形学相关的算法，3d引擎的开发，这都需要图形学相关知识。
4.学HTML5,你需要掌握这几个知识点
Html5开发可谓是这几年来特别“受宠”的软件开发了，html5不仅入行门槛低、薪资高，发展前景更是可观，所以得到大家的追捧和青睐也是实至名归的，那么想要从事html5开发学习要掌握哪些必备的知识呢？
那么想要学好html5开发，那么需要掌握的专业技术有：
第1阶段：前端页面重构：PC端网站布局、HTML5+CSS3基础项目、WebAPP页面布局；
第2阶段：JavaScript高级程序设计：原生JavaScript交互功能开发、面向对象开发与ES5/ES6、JavaScript工具库自主研发；
第3阶段：PC端全栈项目开发：jQuery经典特效交互开发、HTTP协议，Ajxa进阶与后端开发、前端工程化与模块化应用、PC端网站开发、PC端管理信息系统前端开发；
第4阶段：移动端webAPP开发：Touch端项目、微信场景项目、应用Vue.js开发WebApp项目、应用Ionic开发WebApp项目、应用React.js开发WebApp;
第5阶段：混合（Hybrid）开发：各类混合应用开发；
第6阶段：NodeJS全栈开发：WebApp后端系统开发；
第7阶段：大数据可视化：数据可视化入门、D3.jS详解及项目实战。
如今移动互联网发展迅速，技术不断的更新迭代，所学知识也需与时俱进。现在市场上的主流互联网网站，需要打造的是一流用户交互体验。对于前端开发者的要求，不再是简单的页面展示，而是需要全栈式的前端开发工程师。
5.web前端开发需要用到哪些知识
1. HTML5 + CSS3 + JavaScript Web开发基础中的基础，HTML是负责网页结构，CSS负责网页样式，JS则负责逻辑交互。
前两者更像是标记语言，没有什么逻辑，JS才是前端的重中之重。 HTML5 新增的技术大部分需要结合JS学习。
每个人学习进度可能不同，这个阶段主要是多仿站，熟悉基础，试试用CSS写响应式页面，了解JS深入性的知识，比如原型链、闭包、设计模式 等需要更多的积累，逐渐理解并实践掌握。 2. JQuery + BootStrap + Ajax + Json jQuery是JS的一个应用库，能够提升原生JS开发效率。
Bootstrap则是响应式框架，更简单的实现手机/平板/PC多个设备的页面支持。Ajax技术用于异步交互，不刷新页面就能更新数据，比如 地图 应用等。
Json是一种数据格式，被广泛应用在各大编程语言中。 jQuery 和 bootstrap 会简化很多编写的代码量，用着不亦乐乎，但对于基础还不是很扎实的人建议还是少用。
Ajax 和 json 通常用于和后端交互，在实际业务中也经常用到。 3. Git/SVN 版本管理工具，主要用于团队开发时避免文件冲突，也可回档。
前端推荐学习Git。 4. Nodejs + Mysql /MongoDB（可选） 运行在服务器端的JavaScript。
Express是其拓展MVC框架。其中nodejs最常用到的就是npm包管理器，不用到各个网站去下载资源包。
数据库 的学习可以选择MongoDB或者MySQL，前者与Nodejs的契合度更好，不过现在大多数网站都是 PHP +Mysql的组合，如果有学PHP的打算的话，可以先学习 Mysql 。 5. ECMAScript 6 JavaScript 的语言标准。
ES6中加入了很多新的概念，也弥补了之前版本中JS的很多缺陷，越来越多的项目开始运用ES6进行开发。学之前最好把ES5先搞懂了，目前实际项目中考虑到兼容性，ES6是需要通过Babel将其编译为ES5来部署的。
6. Angular/React/Vue 前端三大框架，各自也有着各自的生态系统，根据需求自行选择学习。目前企业需求量最大的仍然是Angular，但近期趋势来看react和vue则更受欢迎。
因为现在前端技术发展太过于突飞猛进，工具和框架的更新比翻书还快，建议学习还是看文档比较好。学习过程中也会遇到很多用到各种构建工具的时候。
7. 其他常用工具 这个一样是根据需求自行选择学习。比较常用的现在有 Web pack，可以将多个不同编程风格的文件打包，比如ES6/AMD/CMD之类的模块化都能识别并编译成 浏览器 能运行的文件。
Sass/Less,CSS预编译框架，可以用带有逻辑性的方式编写CSS代码。Gulp/Grunt构建工具，可以自动化对代码进行压缩合并等工作。
8. 其他后端编程语言 目前市场对前端基本都要求会一门后端语言， PHP / JAVA / Nodejs / Python 等。
6.前端这么多知识点该怎么记忆
前端涉及到的知识确实是比较广的，先要理清一定的框架，然后有条理的进行学习才能事位功半，这里我有一份知识体系给你了解一下
如果你有毅力可以坚持下去就自己好好的自学，但如果觉得效率不是很好条件允许的话也可以考虑参加系统的培训，虽然要花钱但可以省不少的时间，自己权衡。
3. 如何面试前端工程师
随着时代的发展，很多新兴的就业职位随之产生。前端工程师将就是随着互联网的快速发展而产生的。其实在很多人的观念里，前端工程师也就是一个切页面的而已，他们也就是会html、css、javascript这些没有任何技术含量的网页制作而已。然而随着技术飞速发展，人们对这些技术的要求也是越来越高，如果只凭着一个人来把所有的事情都解决是很困难的，所以这个时候前端工程师就开始发挥着他们很大的作用了。
那我们应该如何来面试前端工程师呢？
谈吐要大方得体
在我们在面对面试官时我们千万不要紧张。在进行自我介绍时我们要努力做到自信大方、吐字清晰。我们在自我介绍时要用简明扼要的话语来介绍自己，突出自己的优点表明自己的求职意向。你要通过寥寥数语把自己的优势都向面试官介绍清楚。记住不必要的话语要少说。
好了关于如何面试前端工程师这个话题我就聊到这了。希望我的回答能对你有所帮助。
4. web前端开发简历的技能怎么写
熟练使用 HTML5 + Css3 及其新特性；
熟练使用 JavaScript 及 ES6 新特性；
熟练使用 Vue（vue-cli、vuex、vue-router、axios）等主流技术进行项目开发并对node.js有相应的了解；
了解使用过的常用 UI框架：Bootstrap、vant；
了解 webpack 打包工具，熟练使用git代码托管工具；
了解 Less预处理语言；
了解 微信小程序 开发流程
这是我的，你可以参考参考
5. 前端项目被问到都用了哪些技术站该怎么回答
IT术语。
前端技术栈有：1、HTTP协议；2、编辑器；3、框架类型；4、跨域技术；5、推送技术；6、数据可视化；7、CSS预处理器；8、UI框架；9、异步编程等等。
熟练使用Vue、React、Angular等相关技术栈,对原理有自己的理解。深刻理解Web标准,对可用性、可访问性等相关知识有实际的了解。
6. web前端开发需要用到哪些知识
前端前景是很不错的，像前端这样的专业还是一线城市比较好，师资力量跟得上、就业的薪资也是可观的，学习前端可以按照路线图的顺序，
0基础学习前端是没有问题的，关键是找到靠谱的前端培训机构，你可以深度了解机构的口碑情况，问问周围知道这家机构的人，除了口碑再了解机构的以下几方面：
1. 师资力量雄厚
要想有1+1>2的实际效果，很关键的一点是师资队伍，你接下来无论是找个工作还是工作中出任哪些的人物角色，都越来越爱你本身的技术专业前端技术性，也许的技术专业前端技术性则绝大多数来自你的技术专业前端教师，一个好的前端培训机构必须具备雄厚的师资力量。
2. 就业保障完善
实现1+1>2效果的关键在于能够为你提供良好的发展平台，即能够为你提供良好的就业保障，让学员能够学到实在实在的知识，并向前端学员提供一对一的就业指导，确保学员找到自己的心理工作。
3. 学费性价比高
一个好的前端培训机构肯定能给你带来1+1>2的效果，如果你在一个由专业的前端教师领导并由前端培训机构自己提供的平台上工作，你将获得比以往更多的投资。
希望你早日学有所成。
7. Web前端岗位面试题有哪些
前端面试题汇总，多余的就不说先做会这些东西吧
HTML
Doctype作用？严格模式与混杂模式如何区分？它们有何意义?
HTML5 为什么只需要写 <!DOCTYPE HTML>？
行内元素有哪些？块级元素有哪些？ 空(void)元素有那些？
页面导入样式时，使用link和@import有什么区别？
介绍一下你对浏览器内核的理解？
常见的浏览器内核有哪些？
html5有哪些新特性、移除了那些元素？如何处理HTML5新标签的浏览器兼容问题？如何区分 HTML 和 HTML5？
简述一下你对HTML语义化的理解？
HTML5的离线储存怎么使用，工作原理能不能解释一下？
浏览器是怎么对HTML5的离线储存资源进行管理和加载的呢？
请描述一下 cookies，sessionStorage 和 localStorage 的区别？
iframe有那些缺点？
Label的作用是什么？是怎么用的？（加 for 或 包裹）
HTML5的form如何关闭自动完成功能？
如何实现浏览器内多个标签页之间的通信? (阿里)
webSocket如何兼容低浏览器？(阿里)
页面可见性（Page Visibility）API 可以有哪些用途？
如何在页面上实现一个圆形的可点击区域？
实现不使用 border 画出1px高的线，在不同浏览器的Quirksmode和CSSCompat模式下都能保持同一效果。
网页验证码是干嘛的，是为了解决什么安全问题？
tite与h1的区别、b与strong的区别、i与em的区别？
css
介绍一下标准的CSS的盒子模型？与低版本IE的盒子模型有什么不同的？
CSS选择符有哪些？哪些属性可以继承？
CSS优先级算法如何计算？
CSS3新增伪类有那些？
如何居中div？如何居中一个浮动元素？如何让绝对定位的div居中？
display有哪些值？说明他们的作用。
position的值relative和absolute定位原点是？
CSS3有哪些新特性？
请解释一下CSS3的Flexbox（弹性盒布局模型）,以及适用场景？
用纯CSS创建一个三角形的原理是什么？
一个满屏 品 字布局 如何设计?
常见兼容性问题？
li与li之间有看不见的空白间隔是什么原因引起的？有什么解决办法？
经常遇到的浏览器的兼容性有哪些？原因，解决方法是什么，常用hack的技巧 ？
为什么要初始化CSS样式。
absolute的containing block计算方式跟正常流有什么不同？
CSS里的visibility属性有个collapse属性值是干嘛用的？在不同浏览器下以后什么区别？
position跟display、margin collapse、overflow、float这些特性相互叠加后会怎么样？
对BFC规范(块级格式化上下文：block formatting context)的理解？
CSS权重优先级是如何计算的？
请解释一下为什么会出现浮动和什么时候需要清除浮动？清除浮动的方式
移动端的布局用过媒体查询吗？
使用 CSS 预处理器吗？喜欢那个？
CSS优化、提高性能的方法有哪些？
浏览器是怎样解析CSS选择器的？
在网页中的应该使用奇数还是偶数的字体？为什么呢？
margin和padding分别适合什么场景使用？
抽离样式模块怎么写，说出思路，有无实践经验？[阿里航旅的面试题]
元素竖向的百分比设定是相对于容器的高度吗？
全屏滚动的原理是什么？用到了CSS的那些属性？
什么是响应式设计？响应式设计的基本原理是什么？如何兼容低版本的IE？
视差滚动效果，如何给每页做不同的动画？（回到顶部，向下滑动要再次出现，和只出现一次分别怎么做？）
::before 和 :after中双冒号和单冒号 有什么区别？解释一下这2个伪元素的作用。
如何修改chrome记住密码后自动填充表单的黄色背景 ？
你对line-height是如何理解的？
设置元素浮动后，该元素的display值是多少？（自动变成display:block）
怎么让Chrome支持小于12px 的文字？
让页面里的字体变清晰，变细用CSS怎么做？（-webkit-font-smoothing: antialiased;）
font-style属性可以让它赋值为“oblique” oblique是什么意思？
position:fixed;在android下无效怎么处理？
如果需要手动写动画，你认为最小时间间隔是多久，为什么？（阿里）
display:inline-block 什么时候会显示间隙？(携程)
overflow: scroll时不能平滑滚动的问题怎么处理？
有一个高度自适应的div，里面有两个div，一个高度100px，希望另一个填满剩下的高度。
png、jpg、gif 这些图片格式解释一下，分别什么时候用。有没有了解过webp？
什么是Cookie 隔离？（或者说：请求资源的时候不要让它带cookie怎么做）
style标签写在body后与body前有什么区别？
JavaScript
介绍JavaScript的基本数据类型。
说说写JavaScript的基本规范？
JavaScript原型，原型链 ? 有什么特点？
JavaScript有几种类型的值？（堆：原始数据类型和 栈：引用数据类型），你能画一下他们的内存图吗？
Javascript如何实现继承？
Javascript创建对象的几种方式？
Javascript作用链域?
谈谈This对象的理解。
eval是做什么的？
什么是window对象? 什么是document对象?
null，undefined的区别？
写一个通用的事件侦听器函数(机试题)。
[“1”, “2”, “3”].map(parseInt) 答案是多少？
关于事件，IE与火狐的事件机制有什么区别？ 如何阻止冒泡？
什么是闭包（closure），为什么要用它？
javascript 代码中的”use strict”;是什么意思 ? 使用它区别是什么？
如何判断一个对象是否属于某个类？
new操作符具体干了什么呢?
用原生JavaScript的实现过什么功能吗？
Javascript中，有一个函数，执行时对象查找时，永远不会去查找原型，这个函数是？
对JSON的了解？
[].forEach.call($$("*"),function(a){ a.style.outline="1px solid #"+(~~(Math.random()*(1<<24))).toString(16) }) 能解释一下这段代码的意思吗？
js延迟加载的方式有哪些？
Ajax 是什么? 如何创建一个Ajax？
同步和异步的区别?
如何解决跨域问题?
页面编码和被请求的资源编码如果不一致如何处理？
模块化开发怎么做？
AMD（Moles/Asynchronous-Definition）、CMD（Common Mole Definition）规范区别？
requireJS的核心原理是什么？（如何动态加载的？如何避免多次加载的？如何 缓存的？）
让你自己设计实现一个requireJS，你会怎么做？
谈一谈你对ECMAScript6的了解？
ECMAScript6 怎么写class么，为什么会出现class这种东西?
异步加载的方式有哪些？
documen.write和 innerHTML的区别?
DOM操作——怎样添加、移除、移动、复制、创建和查找节点?
.call() 和 .apply() 的含义和区别？
数组和对象有哪些原生方法，列举一下？
JS 怎么实现一个类。怎么实例化这个类
JavaScript中的作用域与变量声明提升？
如何编写高性能的Javascript？
那些操作会造成内存泄漏？
JQuery的源码看过吗？能不能简单概况一下它的实现原理？
jQuery.fn的init方法返回的this指的是什么对象？为什么要返回this？
jquery中如何将数组转化为json字符串，然后再转化回来？
jQuery 的属性拷贝(extend)的实现原理是什么，如何实现深拷贝？
jquery.extend 与 jquery.fn.extend的区别？
jQuery 的队列是如何实现的？队列可以用在哪些地方？
谈一下Jquery中的bind(),live(),delegate(),on()的区别？
JQuery一个对象可以同时绑定多个事件，这是如何实现的？
是否知道自定义事件。jQuery里的fire函数是什么意思，什么时候用？
jQuery 是通过哪个方法和 Sizzle 选择器结合的？（jQuery.fn.find()进入Sizzle）
针对 jQuery性能的优化方法？
Jquery与jQuery UI有啥区别？
JQuery的源码看过吗？能不能简单说一下它的实现原理？
jquery 中如何将数组转化为json字符串，然后再转化回来？
jQuery和Zepto的区别？各自的使用场景？
针对 jQuery 的优化方法？
Zepto的点透问题如何解决？
jQueryUI如何自定义组件?
需求：实现一个页面操作不会整页刷新的网站，并且能在浏览器前进、后退时正确响应。给出你的技术实现方案？
如何判断当前脚本运行在浏览器还是node环境中？（阿里）
移动端最小触控区域是多大？
jQuery 的 slideUp动画 ，如果目标元素是被外部事件驱动, 当鼠标快速地连续触发外部元素事件, 动画会滞后的反复执行，该如何处理呢?
把 Script 标签 放在页面的最底部的body封闭之前 和封闭之后有什么区别？浏览器会如何解析它们？
移动端的点击事件的有延迟，时间是多久，为什么会有？ 怎么解决这个延时？（click 有 300ms 延迟,为了实现safari的双击事件的设计，浏览器要知道你是不是要双击操作。）
知道各种JS框架(Angular, Backbone, Ember, React, Meteor, Knockout…)么? 能讲出他们各自的优点和缺点么?
Underscore 对哪些 JS 原生对象进行了扩展以及提供了哪些好用的函数方法？
解释JavaScript中的作用域与变量声明提升？
那些操作会造成内存泄漏？
JQuery一个对象可以同时绑定多个事件，这是如何实现的？
Node.js的适用场景？
(如果会用node)知道route, middleware, cluster, nodemon, pm2, server-side rendering么?
解释一下 Backbone 的 MVC 实现方式？
什么是“前端路由”?什么时候适合使用“前端路由”? “前端路由”有哪些优点和缺点?
知道什么是webkit么? 知道怎么用浏览器的各种工具来调试和debug代码么?
如何测试前端代码么? 知道BDD, TDD, Unit Test么? 知道怎么测试你的前端工程么(mocha, sinon, jasmin, qUnit..)?
前端templating(Mustache, underscore, handlebars)是干嘛的, 怎么用?
简述一下 Handlebars 的基本用法？
简述一下 Handlerbars 的对模板的基本处理流程， 如何编译的？如何缓存的？
用js实现千位分隔符?(来源：前端农民工，提示：正则+replace)
检测浏览器版本版本有哪些方式？
我们给一个dom同时绑定两个点击事件，一个用捕获，一个用冒泡，你来说下会执行几次事件，然后会先执行冒泡还是捕获
其他问题
原来公司工作流程是怎么样的，如何与其他人协作的？如何夸部门合作的？
你遇到过比较难的技术问题是？你是如何解决的？
设计模式 知道什么是singleton, factory, strategy, decrator么?
常使用的库有哪些？常用的前端开发工具？开发过什么应用或组件？
页面重构怎么操作？
列举IE与其他浏览器不一样的特性？
99%的网站都需要被重构是那本书上写的？
什么叫优雅降级和渐进增强？
是否了解公钥加密和私钥加密。
WEB应用从服务器主动推送Data到客户端有那些方式？
对Node的优点和缺点提出了自己的看法？
你有用过哪些前端性能优化的方法？
http状态码有那些？分别代表是什么意思？
一个页面从输入 URL 到页面加载显示完成，这个过程中都发生了什么？（流程说的越详细越好）
部分地区用户反应网站很卡，请问有哪些可能性的原因，以及解决方法？
从打开app到刷新出内容，整个过程中都发生了什么，如果感觉慢，怎么定位问题，怎么解决?
除了前端以外还了解什么其它技术么？你最最厉害的技能是什么？
你用的得心应手用的熟练地编辑器&开发环境是什么样子？
对前端界面工程师这个职位是怎么样理解的？它的前景会怎么样？
你怎么看待Web App 、hybrid App、Native App？
你移动端前端开发的理解？（和 Web 前端开发的主要区别是什么？）
你对加班的看法？
平时如何管理你的项目？
说说最近最流行的一些东西吧？常去哪些网站？
如何设计突发大规模并发架构？
说说最近最流行的一些东西吧？常去哪些网站？
是否了解开源的工具 bower、npm、yeoman、grunt、gulp，一个 npm 的包里的 package.json 具备的必要的字段都有哪些？（名称、版本号，依赖）
每个模块的代码结构都应该比较简单，且每个模块之间的关系也应该非常清晰，随着功能和迭代次数越来越多，你会如何去保持这个状态的？
Git知道branch, diff, merge么?
如何设计突发大规模并发架构？
当团队人手不足，把功能代码写完已经需要加班的情况下，你会做前端代码的测试吗？
说说最近最流行的一些东西吧？平时常去哪些网站？
知道什么是SEO并且怎么优化么? 知道各种meta data的含义么?
移动端（Android IOS）怎么做好用户体验?
简单描述一下你做过的移动APP项目研发流程？
你在现在的团队处于什么样的角色，起到了什么明显的作用？
你认为怎样才是全端工程师（Full Stack developer）？
介绍一个你最得意的作品吧？
你有自己的技术博客吗，用了哪些技术？
对前端安全有什么看法？
是否了解Web注入攻击，说下原理，最常见的两种攻击（XSS 和 CSRF）了解到什么程度？
项目中遇到国哪些印象深刻的技术难题，具体是什么问题，怎么解决？。
最近在学什么东西？
你的优点是什么？缺点是什么？
如何管理前端团队?
最近在学什么？能谈谈你未来3，5年给自己的规划吗？