前端面试题

以下是一些前端开发面试中常见的问题，涵盖了HTML、CSS、JavaScript以及前端框架等方面，希望对你有帮助：

HTML 相关问题

HTML5有哪些新特性？

HTML5 引入了许多新特性和改进，使得网页开发更加简便和功能更强大。以下是一些主要的新特性：

1. 语义元素

HTML5 引入了许多新的语义元素，这些元素使得网页结构更加清晰和有意义：

  • <header>：定义文档或节的头部。
  • <footer>：定义文档或节的页脚。
  • <article>：定义独立的内容区域。
  • <section>：定义文档中的节。
  • <nav>：定义导航链接的部分。
  • <aside>：定义内容之外的内容，如侧边栏。
  • <main>：定义文档的主要内容区域。
  • <figure> 和 <figcaption>：用于标记图像或图表及其说明。

2. 表单增强

HTML5 增强了表单控件和输入类型，使得表单处理更强大：

  • 新的输入类型：email、url、number、range、date、datetime-local、month、week、time、search、tel、color。
  • 表单属性：autocomplete、autofocus、novalidate。
  • 新的表单元素：<datalist>、<output>、<progress>、<meter>。

3. 多媒体元素

HTML5 提供了原生的多媒体支持，不再需要插件：

  • <audio>：用于嵌入音频内容。
  • <video>：用于嵌入视频内容。
  • <track>：为 <video> 和 <audio> 元素提供字幕。

4. 图形与动画

HTML5 引入了新的图形元素和 API：

  • <canvas>：用于绘制 2D 图形，通过 JavaScript 提供动态绘图能力。
  • SVG（可缩放矢量图形）：在 HTML5 中可以直接嵌入 SVG 图像。

5. 存储

HTML5 提供了客户端存储的新的 API：

  • localStorage：提供持久化的本地存储，数据不会随页面关闭而消失。
  • sessionStorage：提供临时本地存储，数据在会话结束（页面关闭）时消失。

6. 离线和缓存

HTML5 提供了应用缓存机制，允许 Web 应用在离线状态下运行：

  • AppCache：通过 manifest 文件指定需要缓存的资源。

7. Geolocation API

HTML5 引入了地理定位 API，允许网页获取用户的地理位置：

  • navigator.geolocation.getCurrentPosition：获取当前位置。

8. Web Workers

HTML5 提供了 Web Workers API，使得在后台运行 JavaScript 代码成为可能，避免阻塞用户界面：

  • Worker：创建新的 Web Worker 线程。

9. Web Sockets

HTML5 引入了 Web Sockets API，提供了双向通信能力：

  • WebSocket：用于创建与服务器的双向通信通道。

10. 拖放

HTML5 支持原生的拖放（drag-and-drop）功能：

  • draggable 属性：设置元素为可拖动。
  • 相关事件：dragstart、drag、dragenter、dragover、dragleave、drop、dragend。

11. 其他 API

HTML5 还引入了一些其他的 API，增强了网页应用的功能：

  • History API：允许修改浏览器的历史记录。
  • FullScreen API：允许网页进入全屏模式。
  • Notification API：允许网页向用户发送通知。

这些新特性和增强功能使得 HTML5 成为了一个强大且灵活的前端开发标准，广泛应用于现代 Web 开发中。