
书: https://pan.baidu.com/s/1jDVnfhmGRwu5jeEuV63Kcg?pwd=bmyj
笔记如下:
- HTML5标准体系:涵盖语义化标签、多媒体、图形、离线存储等核心规范,取代HTML4/XHTML。
- 语义化标签:
<header>
、<article>
、<section>
等增强内容结构,提升SEO与可访问性。 - 表单增强:
- 新增输入类型(
email
、date
、range
)。 - 属性如
required
、pattern
实现客户端验证。
- 多媒体支持:
- 原生
<video>
/<audio>
标签,无需Flash插件。 MediaSource API
实现动态流媒体(如DASH)。
- Canvas绘图:
- 2D绘图(
getContext('2d')
)支持路径、渐变、图像合成。 - 逐帧动画优化(
requestAnimationFrame
)。
- SVG集成:矢量图形内联支持,CSS/JS操作DOM节点。
- Web存储:
localStorage
(持久化)与sessionStorage
(会话级)。- 替代Cookie存储结构化数据(JSON序列化)。
- IndexedDB:浏览器端NoSQL数据库,支持事务与索引查询。
- 离线应用:
manifest
文件(已废弃)→ Service Worker动态控制缓存。Cache API
管理资源离线可用性。
- Web Workers:多线程编程(
Worker
对象),避免主线程阻塞。 - WebSocket:全双工通信(
ws://
协议),替代长轮询(Long Polling)。 - 地理定位:
navigator.geolocation
获取用户位置(需授权)。 - 拖放API:
draggable
属性与DataTransfer
对象实现文件/元素拖放。 - Web组件:
Custom Elements
自定义标签。Shadow DOM
封装样式与结构。
- 响应式设计:
<picture>
/srcset
适配多分辨率。- CSS媒体查询(
@media
)与视口单位(vw
/vh
)。
- 性能优化:
- 预加载(
<link rel="preload">
)。 - 懒加载(
loading="lazy"
)。
- 预加载(
- 安全机制:
- CSP(内容安全策略)防御XSS。
iframe
的sandbox
属性限制权限。
- ARIA无障碍:
role
与aria-*
属性提升屏幕阅读器兼容性。 - 现代API整合:
Fetch API
取代XMLHttpRequest
。WebRTC
实现实时音视频通信。
- 渐进式Web应用(PWA):
- Service Worker离线缓存。
manifest.json
定义桌面图标与启动行为。