web前端自学入门视频教程分享
学习前端,要从学习HTML和CSS开始着手。关于这部分的学习,网上可选择的资料就太多了,这里不一一列举,题主百度搜索栏搜索 HTML 教程,或者css 教程,就可找到相关资料。
接着是学习前端的一个难点、也是重点,就是JavaScript。
首先,初学一门语言,要秉承一个原则:“能动手的,尽量别吵吵”
另外,你需要一个能够从简到难的知识体系,一步一步跟下来。
下面是干货。
体系:上图。
说明一下这张图,题主提问如何有效学习JS,我这里理解为JS原生,所以关于框架、工作流的内容,没有具体展开,题主有兴趣可以自行搜索。
1.文档资料
a) 红宝书(基础):https://book.douban.com/subject/10546125/
b) 蝴蝶书(进阶):https://book.douban.com/subject/11874748/
c) 阮一峰老师ES6: http://es6.ruanyifeng.com/
d) 权威官方文档MDN:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript
2.学习步骤
a) 语法和基本类型
b) 控制流
c) 循环
d) 表达式和操作符
e) 日期对象
f) 正则表达式
g) 对象
上面这些搞定,就已经掌握了ES5的最基本的内容了,接着,我们就可以来操作页面了。毕竟这是一个看脸的社会,我们在搞页面的同时,还要注意一下页面的样式。
h)DOM操作
i. DOM树的概念
ii. 从DOM树取节点
iii. 操作这个DOM树(节点的添加、删除、修改)
iv. 访问节点(parentNode, children, 等等)
v. 属性操作(id, className)
i)事件处理
i. 鼠标事件(mouseove)
ii. 键盘事件(keyup)
iii. 浏览器事件(load)
好,到这里,基本上静态页面,你就可以随意玩耍了。这里我们最好降上面思维导图提到的例子,都撸一遍。一是加深上面知识点印象,二是锻炼一下编程的逻辑思维能力。具体实现,网上有一堆堆的。(这里让题主自己搜索,是因为编码的一项重要能力,就是搜索)一定要谨记,多敲代码。
j) 面向对象:原型式继承、原型链
k) ES6:
ES6跟ES5还是有较大的区别,所以建议你能系统的过一遍,将上面的练习,改为使用ES6再来一遍
3.调试
a) JS编程的调试非常简单,打开浏览器控制台(我个人比较钟爱Chrome)。如图:
i. console标签:这个标签,可以打印我们开发时,JS引擎为我们抛出的异常。我们可以根据这个异常的信息,来分析错误原因。另外,我们也可以在代码中使用console.log() 输出程序运行时的环境变量信息。
ii. 右红框1:错误提示。说明当前页有一个error发生,点击他,可以跳转到console来查看错误具体信息
iii. 右红框2:警告信息。提示了我们程序潜在的危险。
iv. source,我们进行单步调试的地方。具体见下图
4.工作流(跟JS原生关系不大,不详细展开了)
a) webpack
b) gulp
上面的内容结束后,就可以进入前端框架的海洋中畅游了。
原文来自知乎用户:Eric
web前端自学入门视频教程分享相关推荐
- Web前端开发入门学习分享
Web前端开发入门学习分享 1:如何开始学习Web前端 首先你需要学习html的各个标签,掌握其用法和规范,明白其作用. 开始学习css的使用,你先学习在html页面中为标签增加css样式,其次是将c ...
- web前端自学之路分享
前言: 2018年随着编程的火热和自身对这岗位的热爱,这一年毅然决然的开始了自己的自学之路,这一阶段的学习过程中有很多感触,随着工作逐步稳定想要写下来和正在学习或者正在犹豫要不要学习的人们一起分享.也 ...
- java webpack web项目_零基础如何学习web前端,入门教程分享
前端作为互联网时代直接触达用户的窗口,大到我们每天浏览到的网站,小到一次点击按钮的页面,前端无处不在.并且在产品的众多开发环节之中,最能让用户直观感受到的就是前端开发.因而前端行业的广阔发展前景也吸引 ...
- 网易微专业web前端开发课程视频教程分享
网易微专业web前端开发课程 链接:点此下载 密码:oeqx 限时领取视频教程
- web前端开发入门视频教程 前端架构师课程
web前端架构师,其实就是高级开发的代名词.因为架构是一个整体,没有孤立的前端与后端.如果一定要这么分,就说明你的工作在这个单位的任务倾向和内容就是那么点玩意儿,而这又有多少呢?页面开发以及相关的那么 ...
- web前端自学学习方法分享
web前端自学学习方法分享 1.web前端自学学习误区总结 在分享给大家入门前端的学习方法之前,我们先来看看一些新手常犯的学习误区,大家可以引以为戒.比如盲目看太多书或各种学习视频,这样会迷失学习的方 ...
- 一个「学渣」的从零Web前端自学之路,附学习资源分享
从 13 年专科毕业开始,一路跌跌撞撞走了很多弯路,做过餐厅服务员,进过工厂干过流水线,做过客服,干过电话销售可以说经历相当的"丰富". 最后的机缘巧合下,走上了前端开发之路,作为 ...
- 一个「学渣」从零开始的Web前端自学之路
从 13 年专科毕业开始,一路跌跌撞撞走了很多弯路,做过餐厅服务员,进过工厂干过流水线,做过客服,干过电话销售可以说经历相当的"丰富". 最后的机缘巧合下,走上了前端开发之路,作为 ...
- 一个「学渣」从零Web前端自学之路
从 13 年专科毕业开始,一路跌跌撞撞走了很多弯路,做过餐厅服务员,进过工厂干过流水线,做过客服,干过电话销售可以说经历相当的"丰富". 最后的机缘巧合下,走上了前端开发之路,作为 ...
最新文章
- Iar环境c语言调用汇编函数,如何在IAR EWARM中通过内联汇编程序在另一个模块中调用C函数?...
- C++:随笔6---new\delete\虚方法\抽象方法
- PC 时代旧神隐没,互联网的新二十年开始了
- find命令应用详解
- MTK6589下传感器框架结构和代码分析以及传感器的参数指标
- python网页优化公司_使用python优化scipy.optimize.minimize公司
- 全网最全!2021最新常用肿瘤生信数据库收藏级汇总!
- VTK:Shaders之ColorByNormal
- zblog主题OL免费清爽资讯博客主题
- Django:ORM基本操作-CRUD,管理器对象objects,----->查询3(单条更新,批量更新)
- 获取输出最大角标 php,html实现消息按钮上的数量角标的实例详解
- 分布式搜索Elasticsearch——QueryBuilders.matchPhrasePrefixQuery
- mysql用root账户建立用户和赋予权限
- 全球与中国调频广播发射机市场深度研究分析报告
- STM8单片机STVD环境新建工程笔记
- 用python写Hello World
- 服务器ubuntu系统调节亮度,ubuntu 设置显示器的亮度
- HAOI2017 八纵八横——线段树分治+线性基
- Oracle数据库大作业
- JavaScript从入门到摔门(2万字超详细的JS知识)
热门文章
- html中刷新按钮的代码,常见的按钮类型 点击button刷新的几种常用代码
- oracle 10g 关库,Oracle Db10g 启动和关闭数据库
- vscode安装python插件失败_vscode插件安装失败的解决方案
- 20220202--CTF刷题MISC方向--第8题--十六进制转化成ASCII
- 2019_7_31python
- NAS组建日记(一):来块大硬盘先—HGST 10TB NAS硬盘开箱小测
- 2017年天津市大学生数学竞赛试题 (理工类)
- 刷新SqlServer所有视图【存储过程】
- HDU2855 Fibonacci Check-up 矩阵的应用
- 增加RSS订阅量的35个方法