跳到主要内容

HTML 基本概念

doctype(文档类型) 的作用是什么？​

答案

在 html 标准未统一之前,浏览器都有自己的渲染规则，在标准统一后,为了兼容旧版本,存在如下渲染模式

  • quirks mode 怪异模式,浏览器自行决定
  • almost standards mode 几乎标准模式,浏览器自行决定
  • standards mode 标准模式,尽可能遵守 html 规范

doctype 就是用来限定文档的渲染模式

可以利用 document.doctype 获取该配置

此外还存在如下 DTD

<!DOCTYPE html> 是 HTML5 的文档类型声明（Document Type Declaration），它的作用是告诉浏览器当前文档使用的是 HTML5 规范。

具体来说，<!DOCTYPE html> 的作用有以下几个方面：

  1. 指定文档类型：文档类型声明告诉浏览器当前文档所使用的 HTML 版本，即 HTML5。这样浏览器就可以按照 HTML5 的规范来解析和渲染文档。

  2. 规范浏览器行为：文档类型声明还可以影响浏览器的行为。HTML5 的文档类型声明告诉浏览器以标准模式（standards mode）来解析文档，以确保一致的行为和渲染结果。

  3. 提供更好的兼容性：使用 <!DOCTYPE html> 可以确保文档在不同浏览器中具有一致的处理方式。不同的浏览器对不同版本的 HTML 有不同的处理方式，而使用 HTML5 的文档类型声明可以使浏览器以最新的标准模式来解析文档，提供更好的兼容性和一致性。

总结来说，<!DOCTYPE html> 是 HTML5 的文档类型声明，它告诉浏览器当前文档使用的是 HTML5 规范，以规范浏览器的行为，并提供更好的兼容性和一致性。在编写 HTML5 文档时，通常将 <!DOCTYPE html> 放置在文档的开头作为文档类型声明。

什么是 HTML 语义化？​

答案

HTML 语义化是指使用恰当的 HTML 标签来表达内容的结构和含义。其核心包括：

  1. 内容语义

    • 使用合适的标签表达内容含义
    • 让代码具有自描述性

  2. 结构语义

    • 清晰的文档大纲
    • 合理的层次关系

  3. 目的意义

    • 提升可访问性
    • 优化搜索引擎理解
    • 提高代码可维护性

延伸阅读

HTML5 引入了哪些核心能力？​

答案

HTML5 的核心能力增强：

  1. 语义化增强

    • 结构元素：<header>, <footer>, <nav>, <main>, <section>, <article>, <aside>, <figure>
    • 多媒体元素：<audio>, <video>, <source>, <track>
    • 图形元素：<canvas>, <svg>
    • 表单增强：<datalist>, <output>, <progress>, <meter>, 新增输入类型

  2. 应用程序接口

    • 存储 API：
      • localStorage（持久化存储）
      • sessionStorage（会话存储）
      • IndexedDB（客户端数据库）
    • 离线能力：
      • Service Workers
      • Cache API
    • 设备接口：
      • Geolocation API（地理位置）
      • DeviceOrientation API（设备方向）
      • Media Capture and Streams API（媒体捕获）
    • 实时通信：
      • WebSockets
      • WebRTC
      • Server-Sent Events

  3. 多媒体能力

    • 原生音视频支持：无需插件播放多媒体内容
    • 媒体控制接口：Media API, MediaRecorder API
    • 流媒体能力：Media Source Extensions, Encrypted Media Extensions
    • WebRTC：点对点音视频通信

  4. 相关优化技术

    • HTML5 标准优化：async/defer 脚本加载属性
    • 并行处理：Web Workers
    • 现代网络请求：Fetch API
    • 图形渲染：Canvas, WebGL
22%