前端学习路线

随着5G技术的逐渐发展和成熟，未来大量的应用场景都需要前端进行呈现，所以未来前端开发将得到更多的重视。想要不被时代所淘汰，我们就需要不断学习，不断完善自己。未来相信所有的网站都会升级成HTML5网站，我们再也不用为了浏览网站去安装各种各样的插件了，并且它的效果会更加的炫酷。 之前界限分明的前端开发和后端开发，未来开始模糊。从趋势上来看，开发团队的人员配备都在向前端倾斜，包括Android开发、iOS开发、PC端开发、小程序开发等，前端工程师承担的角色不断扩大。 另外，Javascript开始向嵌入式领域进军，进一步促进了前端开发的普及化。与此同时，对安全，可靠等的要求越来越高，这都对前端开发提出更新和更严格的要求。虽然网页设计是网站的外观，但前端开发是将该设计的页面通过代码的形式在网络上进行展现，并加入一些功能特效 !使之具有一定的交互性!前端Web开发人员通过HTML，CSS和JavaScript等编码语言实现Web设计的人。 虽然它不再那么常见，但是前端开发人员有时被称为“客户端开发人员”，以区别于后端开发人员，后端是对数据库等幕后工作进行编程。如果您前往任何站点，您可以在导航，布局中查看前端开发人员的工作，甚至可以看到PC页面与手机页面不同的展现方式。 前端Web开发人员使用三种主要编码语言来编写由Web设计人员创建的网站和Web应用程序设计：HTML、CSS

1. hidden hidden是一个布尔属性，表示当前的网页元素不再跟页面相关，因此浏览器不会渲染这个元素，所以就不会在网页中看到它。相当于display:none <p hidden>本句不会显示在页面上。</p> 2. contenteditable 允许用户修改内容 <p contenteditable="true"> 鼠标点击，本句内容可修改。 </p> 3. draggable 是否可以 使用 Drag and Drop API 拖动元素 <div draggable="true">按住鼠标左键拖动试试</div> 4. title 用来为元素添加附加说明。大多数浏览器中，鼠标悬浮在元素上面时，会将title属性值作为浮动提示，显示出来。 <div title="版权说明"> <p>本站内容使用创意共享许可证，可以自由使用。</p> </div> 专门建立的学习Q-q-u-n ⑦⑧④-⑦⑧③-零①② 分享学习方法和需要注意的小细节，互相交流学习，不停更新最新的教程和学习技巧（从零基础开始到WEB前端项目实战教程，学习工具，全栈开发学习路线以及规划） 5. 事件处理属性 onabort, onautocomplete, onautocompleteerror, onblur, oncancel, oncanplay, oncanplaythrough, onchange,

前端是什么？ 在回答这个问题之前，我想到了一道面试题： 当我们在浏览器中输入网址并按回车之后，接下来会发生什么？ 我们来简单地看一看 “网页展现” 的整个过程。 比如这里有一个用户，它需要访问 abc.com 这个网址。一般来说，当用户输入一个域名时，是在请求一个 HTML 资源。当他完成域名解析之后，他的浏览器会向 abc.com 这个域名所指向的 Web 服务器发出请求。 有时候 Web 服务器直接就可以返回用户的请求了；有时候 Web 服务器还需要向数据库查询一些数据，然后才能把处理结果返回给用户。 当用户的浏览器拿到服务器返回的 HTML 资源之后，就开始解析并显示 HTML 的内容了。 一般来说，HTML 页面需要 CSS 资源来描述页面的样式。比如浏览器在解析 HTML 时发现了一个 CSS 外链 abc.com/a.css ，它就会去请求这个资源。 HTML 页面往往还需要加载外部的 JS 资源，比如 abc.com/a.js ，此时浏览器同样会向服务器请求这个资源。 当所需的资源都加载完成之后，这个页面就可以提供完整的外观和功能了。整个过程差不多就是这个样子了。 我们看一看这张流程图，可以在中间画一道竖线，把它分成左右两个部分。 我们会发现，这道线左侧的事情发生在浏览器端，我们称之为 “前端”；右侧的事情发生在服务器端，称为 “后端”。（“前端” 之所以叫 “前端”

作者：知乎用户 链接：https://www.zhihu.com/question/19841848/answer/88535461 来源：知乎 著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。 继上一篇 关于程序员求职简历 之后如果顺利的话就应该是面试了，在此也整理一下最近在网上收集的前端面试相关资料，包括预备知识、书籍、面试考点、面经等。这方面资料其实太多太多，就光从知乎、前端乱炖、w3cplus 等网站就能找到很多，在此仅挑选我看到的比较不错的，更多的资料可以从下面列出来的链接的内容中找到。 1. 前端团队 参考我之前整理的国内知名前端团队的列表（只选了维护了网站、技术型前端团队）： Awesome Front-end Teams 2. 知识技能 前端技能汇总 Frontend Knowledge Structure （源码）（朴灵，阿里巴巴） 大前端的瑞士军刀，只记录有用的（源码）（聂微东，百度） 前端收集（罗磊，腾讯） 知乎上前端开发领域有哪些值得推荐的问答？——知乎 2015-2016前端知识体系图谱（w3ctech） 推荐的一些值得订阅的Weekly（GitHub） 前端收藏夹（源码）（w3ctrian） QQ联盟群交流(492107297)群规（有大量的教程、资料、面试题）（豪情） 3. 学习路线、书籍 前端开发者手册（Pomy，美团） 前端开发

前端学习路线是螺旋上升的，前端学习需要耗费的时间和精力不比其他编程的少，由于前端稳健性的特点，使其成为大多数企业开发的刚需编程语言。 在网上看到有很多的前端学习路线图，但大部分的前端学习路线图是很零碎的，没有系统的前端学习目标和重点知识，也不知道学到什么程度可以找工作。黑马程序员的前端学习路线图是根据主流企业的前端要求不断更新的，黑马程序员的视频库能为你提供各个阶段的自学教程。 前端入门小白在网上搜到前端学习路线图后，傻了，要学习这么多，也没有重点，算了放弃吧。小白也不知道目前哪些技能是市场需要的，哪些技能正在被市场所淘汰掉。 在学习的过程中没有重点，就像大学期末考试老师没有划重点一样，经常是芝麻豆子一把抓。 企业对于前端人才最核心的需求并不是对单纯掌握某种应用型技术，而是希望前端开发者能够通过自己的经验帮助企业解决项目中随时出现的问题。 根据二八定律，我们应该用80%的有限精力去学20%的重点知识，这样学习效果是最优的。话不多说，上学习路线图。 第一阶段：HTML5 + CSS3 此阶段的学习目标： 能够独立把美工提供的PSD效果图还原成PC端静态代码页面。 此阶段的市场价值： 具备PC端静态网页开发的能力，还达不到企业用人标准。为后面学习网页编程阶段打下坚实基础。 此阶段的重点知识： 掌握 HTML5 常用标签； 掌握 CSS 语法及使用技巧； 掌握CSS3新增选择器；

web前端工程师是近几年的新兴职业，也是目前火爆而且高薪的职业。不同的公司也有不同的叫法，比如：网页界面开发，网站设计等，要学好web前端开发，需要掌握什么方法与技巧？ 一、div和table 这个是最简单的，也是最基础的。要熟练掌握div、form table、ul li 、p、span、font这些标签，这些都是最常用的，特别是div和table，div用于布局、table也可以用于布局，但是不灵活，基本 table是用来和数据打交道。 二、CSS 这里说的css不包括css3，一般我们看到web前端开发工程师的要求里面，有一个会使用css+html 或者 css+div 来进行界面布局，所以css是用于辅助html来布局和展示的，我们称之为“css样式”。 为什么会说css+div呢? 因为我上面说了div就是 html主要用于布局的东西，所以div就是核心掌握的东西！那么css肯定必须要配合div来使用才好。css要熟练掌握float、 position、width、height，以及对于的最大最小、会使用百分百、overflow、margin、padding等等。 三、JS 可能前两个大家觉得还过的去，看到js就蛋疼了。 其实，js入门很简单的，不需要会很多东西的，只要会根据某个id、或者name拿到网页dom或者样式、或者值，然后会给某个id或者name的元素标签赋值

【推荐】2019 Java 开发者跳槽指南.pdf(吐血整理) >>> 5G时代来临，各行各业对产品的用户体验需求空前大增。人们在享受互联网带来的便捷也给互联网产品提出了新的需求，这意味着前端开发人员也有了更多的机会和挑战。无论是大小公司，对前端开发工程师的需求都是在快速上涨，薪资待遇也随之上升很快。 前端开发工程师就业机会多，创业机会多，且就业范围广，几乎各行各业都有需要，互联网公司、金融，贸易等等都能进。并且对从事开发的就业者的专业经历不设门槛，学习门槛低，几乎很多人都能学习和从事前端开发工程师工作。面对种种因素，许多大学毕业生，都踏上了转行前端开发工程师的路。但是这条路并不好走，如果选择走了这条路，更是要慎重再慎重。毕竟，这关系着职业发展，如果没有下定决心，最好不要盲目跟风。 电子、机械、平面设计、UI设计转行前端开发的已不算罕见了，现在很多从事非互联网行业的也纷纷转行前端开发了。不过，在这条未知的路上，还有很多同学在转行前端开发这条路上一直在自我摸索，磕磕碰碰。 前端工程师首先是软件工程师，基础是最重要的，如果基础不扎实，一切应用技能就都是“浮云”。前端的基础是什么？HTML、CSS、JavaScript基本功，数据结构、编译原理基本功。前端开发不是一个没有技术含量的编写静态网页的职位，前端的大牛，通常都是可以完成多方向产品的，比如说小程序，H5，APP开发等。

【推荐】2019 Java 开发者跳槽指南.pdf(吐血整理) >>> 作为新手，出于对风险的担心，不免在学习一项新技能或者转投一个新行业的时候，有所犹豫与徘徊。毕竟，在这场类似冒险的选择中，我们需要投入时间、精力以及承受相关的经济损失。但是，只有勇敢迈出第一步，才能为生活注入新活力，面对机遇，我们要及时抓住。就像现在IT行业火热，其中Web前端无论是发展前景还是就业形势都十分可观。那么作为一名新手怎么才能高效学习这门编程语言呢?3个高效学习方法，不容错过！ **　一、基础要十分重视** 首先建立第一条技能线，前端由html、css、js组成;然后将其细化为第二条线，html是由html4和html5组成;第三条线，css由css2和css3组成;第四条线，js由es5和es6构成。接下来是框架方面的延伸，css方向有les;html方向有bootstrap;js方向有jquery库。 再往下延伸一层，html、css方向，有前端构建工具;js除了jq库之外，还有更全面的前端框架，如react、angular、vue等。再往下细化，react是一个view层方案，为了让它能够全面解决前端需求，需要redux、react-router等作为补充。以上知识，都是一个合格的Web前端工程师应该掌握的。 二、学习要进行发散 Web前端是丰富多彩的，你可以融入其中，但不能只停留在这一块领域

【推荐】2019 Java 开发者跳槽指南.pdf(吐血整理) >>> 前端是什么？ 在回答这个问题之前，我想到了一道面试题： 当我们在浏览器中输入网址并按回车之后，接下来会发生什么？ 我们来简单地看一看 “网页展现” 的整个过程。 比如这里有一个用户，它需要访问 abc.com 这个网址。一般来说，当用户输入一个域名时，是在请求一个 HTML 资源。当他完成域名解析之后，他的浏览器会向 abc.com 这个域名所指向的 Web 服务器发出请求。 有时候 Web 服务器直接就可以返回用户的请求了；有时候 Web 服务器还需要向数据库查询一些数据，然后才能把处理结果返回给用户。 当用户的浏览器拿到服务器返回的 HTML 资源之后，就开始解析并显示 HTML 的内容了。 一般来说，HTML 页面需要 CSS 资源来描述页面的样式。比如浏览器在解析 HTML 时发现了一个 CSS 外链 abc.com/a.css ，它就会去请求这个资源。 HTML 页面往往还需要加载外部的 JS 资源，比如 abc.com/a.js ，此时浏览器同样会向服务器请求这个资源。 当所需的资源都加载完成之后，这个页面就可以提供完整的外观和功能了。整个过程差不多就是这个样子了。 我们看一看这张流程图，可以在中间画一道竖线，把它分成左右两个部分。 我们会发现，这道线左侧的事情发生在浏览器端，我们称之为 “前端”

第一阶段： HTML+CSS: HTML进阶、CSS进阶、div+css布局、HTML+css整站开发、 JavaScript基础： Js基础教程、js内置对象常用方法、常见DOM树操作大全、ECMAscript、DOM、BOM、定时器和焦点图。 JS基本特效： 常见特效、例如：tab、导航、整页滚动、轮播图、JS制作幻灯片、弹出层、手风琴菜单、瀑布流布局、滚动事件、滚差视图。 JS高级特征： 正则表达式、排序算法、递归算法、闭包、函数节流、作用域链、基于距离运动框架、面向对象基础、 JQuery：基础使用 悬着器、DOM操作、特效和动画、方法链、拖拽、变形、JQueryUI组件基本使用。 第二阶段：HTML5和移动Web开发 HTML5： HTML5新语义标签、HTML5表单、音频和视频、离线和本地存储、SVG、Web Socket、Canvas. CSS3: CSS3新选择器、伪元素、脸色表示法、边框、阴影、background系列属性改变、Transition、动画、景深和深透、3D效果制作、Velocity.js框架、元素进场、出场策略、炫酷CSS3网页制作。 Bootstrap: 响应式概念、媒体查询、响应式网站制作、删格系统、删格系统原理、Bootstrap常用模板、LESS和SASS。 移动Web开发： 跨终端WEB和主流设备简介、视口、流式布局、弹性盒子、rem