!MOC-WEBAPI

• Web API 知识点大纲
  • ​Web API 概述​
    • 浏览器提供的接口集合
    • 用于实现浏览器和网页的交互功能
    • 包含 DOM、BOM 和其他浏览器功能（如网络请求、存储等）
  • ​DOM（Document Object Model）​​
    • 文档对象模型
      • 将 HTML/XML 文档表示为树形结构
      • 节点类型：元素节点、文本节点、属性节点等
    • 核心操作
      • 元素选择
        • getElementById()
        • getElementsByClassName()
        • querySelector() 和 querySelectorAll()
      • 节点操作
        • 创建节点：createElement(), createTextNode()
        • 插入/删除节点：appendChild(), removeChild(), replaceChild()
        • 遍历节点：parentNode, childNodes, nextSibling, previousSibling
      • 属性操作
        • getAttribute(), setAttribute(), removeAttribute()
        • dataset 属性（自定义数据属性）
      • 样式操作
        • element.style.property
        • classList API（add(), remove(), toggle()）
        • window.getComputedStyle()
      • 事件处理
        • 事件监听：addEventListener(), removeEventListener()
        • 事件对象（event.target, event.preventDefault()）
        • 事件流：捕获阶段、目标阶段、冒泡阶段
        • 事件委托机制
      • 表单操作
        • 表单元素属性（value, checked, selected）
        • 表单验证 API（checkValidity(), setCustomValidity()）
      • 动态内容更新
        • innerHTML 和 textContent 的区别
        • DocumentFragment 优化批量操作
      • 性能优化
        • 减少 DOM 操作（重排与重绘）
        • 节流与防抖技术
      • 新特性
        • Shadow DOM
        • MutationObserver
        • IntersectionObserver
  • ​BOM（Browser Object Model）​​
    • 浏览器对象模型
      • 控制浏览器行为（非文档内容）
    • 核心对象
      • window 对象
        • 全局作用域
        • 窗口控制：open(), close(), resizeTo()
        • 窗口位置：screenX, screenY
      • location 对象
        • URL 操作：href, hostname, pathname, search, hash
        • 页面跳转：assign(), replace(), reload()
      • navigator 对象
        • 浏览器信息：userAgent, platform, language
        • 设备能力检测：geolocation, mediaDevices
      • history 对象
        • 页面历史：back(), forward(), go()
        • 现代路由：pushState(), replaceState()
      • screen 对象
        • 屏幕信息：width, height, colorDepth
      • 定时器
        • setTimeout() 和 clearTimeout()
        • setInterval() 和 clearInterval()
        • requestAnimationFrame()
      • 对话框
        • alert(), confirm(), prompt()
      • 存储相关
        • localStorage 和 sessionStorage
        • Cookies 操作（需手动处理）
      • 性能 API
        • performance.timing（页面加载时间统计）
      • Web Workers
        • 多线程编程：Worker 对象
        • 线程通信：postMessage()
  • ​其他 Web API 相关​
    • 网络请求
      • Fetch API
      • XMLHttpRequest
    • 客户端存储
      • IndexedDB
      • Cache API（Service Worker 相关）
    • 多媒体
      • AudioContext
      • WebRTC
    • 现代 API
      • WebSocket
      • Geolocation API
      • Web Notifications
      • Drag and Drop API