好程序员
技术分享
html5和JavaScript的区别，
HTML5广义上讲是前端开发学科的代名词，包含HTML5、CSS3及JavaScript三个重要的部分，是运行在浏览器上应用的统称。如PC端网站、管理系统、手机网页应用（WebApps）、混合应用（HybridApps）、微信公众号、小程序、小游戏、数据可视化等。
HTML5狭义上讲是指HTML版本5（v5）,相较HTML4，增加了很多新的元素（标签）和元素属性，大大增强了HTML的语义化和表现力，这一部分属于页面结构的内容，比如媒体标签video、audio，画布canvas标签，这三个新标直接K.O了flash。另外，HTML5增加了很多API，为移动APP开发奠定了坚实的基础，比如优化了本地存储（WebStorage）、应用的离线缓存（Application Cache）、地理定位（Geolocation）、监听网络状态等。
上述的
HTML5新增的API就是通过JavaScript来调用的，或者本身就是JavaScript程序。下面列示一些重要的API：
|
API名称
|
功能描述
|
API举例
|
|
应用缓存
|
web 应用可进行缓存，并可在没有因特网连接时进行访问
|
通过配置Manifest文件实现缓存
|
|
WebSQL
|
Web SQL Database概念，它使用 SQL 来操纵客户端数据库的 API
|
openDatabase()
transaction()
executeSql
|
|
本地存储
|
web 应用程序能够在用户浏览器中对数据进行本地的存储
|
window.localStorage
window.sessionStorage
|
|
Canvas
|
HTML5 <canvas> 标签通过JavaScript绘制图像
|
createLinearGradient()
fillRect()
stroke()
bezierCurveTo()
transform()
drawImage()
|
|
文件API
|
让前端操作文件变的可能
|
FileList、File、Blob、FileReader、URL
|
|
地理定位
|
HTML5 Geolocation（地理定位）用于定位用户的位置
|
navigator.geolocation.getCurrentPosition(showPosition)
|
|
多媒体
|
在网页里播放音频和视频的新的Api
|
video，audio系列API
|
|
拖放
|
优化了原生JavaScript实现的拖放
|
ondragstart、setData()、ondragover、ondrop
|
|
history
|
window对象通过history对象提供了对浏览器历史的访问
|
pushState()、replaceState()
|
|
网络状态
|
HTML5网络状态检测
|
window.ononline、window.onoffline
|
|
WebWorker
|
web worker 是运行在后台的 JavaScript，不会影响页面的性能
|
new Worker()、postMessage()
|
|
WebSocket
|
WebSocket 是 HTML5 开始提供的一种在单个 TCP 连接上进行全双工通讯的协议
|
Socket.send()、Socket.close()
|
以上可见，
HTML5新增的API，是离不开JavaScript的，JavaScript是前端开发的核心，只学HTML5，或者说只学HTML5标签是不能进行前端开发的，或者这样说本来就是不全面的，因为HTML5是包含JavaScript Api的。
目前，大前端的概念已经深入人心，大前端开发的职业前景越发的广阔，
Google fluter，人工智能（AI）在前端的应用赋能大前端开发，使这些从业者越来越抢手。
大前端开发包括很多内容
: HTML5,CSS3,JavaScript,ES,TypeScript,BootStrap,jQuery,Vue.js, React, RN, Angular, 各类小程序，JavaScript库，前端开发工具，Node.js,状态管理，桌面开发(Electron), 前端单元测试，服务器，Socket编程，服务端渲染，前端架构等等。
小白入门，一时间还真有点无从下手。如果基础好，自学能力强，自制能力强，可以买些书籍或视频学习，如果想系统的短期速成，可以考虑报个培训班。
希望能帮到你，祝你早日炼成前端达人。