前端经典面试题合集, 什么是 HTML5,HTML5 有哪些新特性?

QA

Step 1

Q:: 什么是HTML5？

A:: HTML5是最新一代的HTML标准，由W3C制定。它引入了许多新特性和标签，以增强网页的功能性和用户体验。HTML5不仅简化了网页的结构和语义标记，还集成了多媒体、图形和互动功能。

Step 2

Q:: HTML5有哪些新特性？

A:: HTML5引入了以下主要新特性： 1. 语义标签：如<article>、<section>、<header>、<footer>等，增强了网页的结构和可读性。 2. 多媒体标签：<audio>和<video>，用于嵌入音频和视频文件。 3. 图形和效果：<canvas>和<svg>，用于绘制2D图形和矢量图。 4. 新的表单控件：如<datalist>、<keygen>、<output>等，增强了表单的功能。 5. 本地存储：localStorage和sessionStorage，用于在客户端存储数据。 6. 地理定位：Geolocation API，用于获取用户的地理位置。 7. 离线和缓存：通过Application Cache使网页在离线时也能正常工作。

用途

相关问题

🦆

什么是语义化的HTML?为什么重要?▷

语义化的HTML指的是使用描述性标签来标记网页内容，比如使用<header>表示头部，<article>表示文章。语义化HTML有助于SEO优化、提高可访问性、增强代码可读性和可维护性。

🦆

如何使用HTML5实现离线网页?▷

可以使用HTML5的Application Cache，通过manifest文件列出需要缓存的资源，使得网页在离线状态下也能正常访问。具体步骤包括：创建manifest文件，指定需要缓存的文件，在HTML文件的<html>标签中引用manifest文件。

🦆

HTML5的本地存储与cookie有什么区别?▷

本地存储（localStorage和sessionStorage）相比cookie有以下区别： 1. 存储容量更大，localStorage一般可以存储5MB的数据，而cookie通常只能存储4KB的数据。 2. 本地存储的数据只在客户端保存，不会随每次HTTP请求发送到服务器，从而减小了请求体积。 3. localStorage的数据持久化保存，除非手动删除，而sessionStorage的数据在会话结束时清除。

🦆

什么是HTML5的canvas元素?如何使用它绘制图形?▷

<canvas>元素用于绘制2D图形和动画。使用时需要通过JavaScript获取绘图上下文（context），然后使用该上下文的绘图方法进行绘制。例如：

 
<canvas id='myCanvas' width='200' height='200'></canvas>
<script>
var canvas = document.getElementById('myCanvas');
var ctx = canvas.getContext('2d');
ctx.fillStyle = 'green';
ctx.fillRect(10, 10, 100, 100);
</script>

什么是前后端分离它有什么优点和缺点什么是JS对象的可枚举性（enumerable）？