本文已参与「新人创作礼」活动，一起开启掘金创作之路。

大家好，我是木大木大，面对就业寒冬，我一个应届生也是到现在也没有就业嘛，就想的来复习一下基本的知识以及面试题这些，求求工作啦~

HTML

首先我们看一下html的东西，面试了几家公司一般来说没有问这方面的东西，但是之前有个北京的公司面试就问了一些基础的html，css这些问题有一些没回答上来，让我回来多看看说北京那边问这些比较多。

1 html5语义化

html语义化这个算是很经典的面试题了吧，之前看公司招聘都有要了解这些，虽然没问过...

html语义化通俗来讲就是使用正确的标签做正确的事情。

那么语义化的标签有那些呢？

header 头部标签
nav 导航栏标签
main 主要区域标签
article 主要内容标签
section 区块标签(就是语义化的div)
aside 侧边栏标签
footer 底部标签

语义化标签的优点是什么，为什么要使用html语义化：

首先就是结构清晰，在没有css样式的情况下，页面照样可以呈现很好的结构，便于阅读。
其次是利于开发和维护，有利于搜索引擎优化就是seo，更适合搜索引擎的爬虫爬取有效信息，赋予不同的权限。

2 html5的新特性

这个是我被问到的一个问题，之前刚毕业不知道这些，后来搜了一下重点记忆之后居然没人问了，还是要说一下。

语义化标签，刚才已经讲了语义化标签的内容和优点，
新增的媒体标签 audio（音频）和 video（视频）
表单新增了一些类型，比如email，search,time等等，还有一些属性，placeholder（提示信息），autofocus（获取焦点）等等
新增了进度条，度量器
新增DOM查询操作
- document.querySelector()
- document.querySelectorAll()
新增客户端存储数据的方法
- localStorage - 没有时间限制的数据存储
- sessionStorage - 针对一个 session 的数据存储
新增画布canvas
新增svg矢量图形
新的技术 webworker、websocket、geolocation

3 HTML5的离线存储

离线存储是指用户和因特网没有连接的时候，可以正常访问站点或者应用，在用户机器上更新缓存的文件。

使用方法是场景一个manifest文件，在页面头部加入manifest属性，在cache.manifest文件中编写需要离线存储的资源。在离线状态时，操作 window.applicationCache 进行离线缓存的操作。

CACHE MANIFEST
    #v0.11
    CACHE:
    js/app.js
    css/style.css
    NETWORK:
    resourse/logo.png
    FALLBACK:
    / /offline.html

那么实现离线缓存的原理是：HTML5的离线存储是基于一个新建的 .appcache 文件的缓存机制(不是存储技术)，通过这个文件上的解析清单离线存储资源，这些资源就会像cookie一样被存储了下来。之后当网络在处于离线状态下时，浏览器会通过被离线存储的数据进行页面展示。

4 canvas和SVG的区别

（1）SVG： SVG可缩放矢量图形（Scalable Vector Graphics）是基于可扩展标记语言XML描述的2D图形的语言，SVG基于XML就意味着SVG DOM中的每个元素都是可用的，可以为某个元素附加Javascript事件处理器。在 SVG 中，每个被绘制的图形均被视为对象。如果 SVG 对象的属性发生变化，那么浏览器能够自动重现图形。

其特点如下：

不依赖分辨率
支持事件处理器
最适合带有大型渲染区域的应用程序（比如谷歌地图）
复杂度高会减慢渲染速度（任何过度使用 DOM 的应用都不快）
不适合游戏应用

（2）Canvas： Canvas是画布，通过Javascript来绘制2D图形，是逐像素进行渲染的。其位置发生改变，就会重新进行绘制。

其特点如下：

依赖分辨率
不支持事件处理器
弱的文本渲染能力
能够以 .png 或 .jpg 格式保存结果图像
最适合图像密集型的游戏，其中的许多对象会被频繁重绘

5 web标准，w3c标准

之前在看公司招聘需求的时候总是会看到需要熟悉w3c标准，就好奇这个标准到底是什么。

主要就是标签需要闭合，标签该小写小写，不乱加嵌套这些，还有就是css和js使用外部引入，结构清晰。

目前差不多就这些的样子了，这里的问题不多，小小的复习一下子拉~

html的杂乱无章了解