html5常用API包括：一、Geolocation获取地理位置；二、canvas绘制图形动画；三、LocalStorage持久化存储；四、Fetch发起网络请求；五、MediaDevices访问音视频设备。
html5 提供了多种原生浏览器 API，用于增强网页交互能力与功能表现。以下是 HTML5 常用 API 的调用方式及具体使用步骤：
一、使用 Geolocation API 获取用户地理位置
Geolocation API 允许网页在获得用户明确授权后获取其经纬度信息，适用于地图定位、附近服务等场景。
1、检查浏览器是否支持该 API：if (“geolocation” in navigator)。
2、调用 navigator.geolocation.getCurrentposition() 方法请求当前位置。
立即学习“前端免费学习笔记（深入）”；
3、在成功回调函数中接收 position.coords.latitude 和 position.coords.longitude。
4、在失败回调中处理错误码，例如 positionError.PERMISSION_DENIED 表示用户拒绝授权。
二、使用 Canvas API 绘制图形与动画
Canvas API 通过 <canvas></canvas> 元素提供位图绘制能力，需借助 javaScript 获取上下文对象进行绘图操作。
1、在 HTML 中添加 。
2、使用 document.getElementById(“myCanvas”).getContext(“2d”) 获取 2D 渲染上下文。
3、调用 ctx.fillRect(x, y, width, height) 绘制填充矩形。
4、使用 ctx.beginPath()、ctx.arc() 和 ctx.stroke() 绘制圆形轮廓。
三、使用 LocalStorage API 持久化存储数据
LocalStorage 提供键值对形式的同步、持久化客户端存储，数据在关闭浏览器后仍保留，且无过期时间。
1、使用 localStorage.setItem(“key”, “value”) 存储字符串数据。
易优微信教育培训小程序模板是基于前端开源小程序+后端易优cms+标签化API接口，是一套开源、快速搭建个性化需求的小程序CMS。轻量级TP底层框架，前后端分离，标签化API接口可对接所有小程序，支持二次开发。即使小白用户也能轻松搭建制作一套完整的线上版小程序。 微信教育培训小程序模板主要特点：1、代码开源，支持二次修改2、微信原生写法，兼容性更好，代码可读性更强3、功能接口完整，支持eyoucms
0 
2、使用 localStorage.getItem(“key”) 读取对应键的值。
3、使用 localStorage.removeItem(“key”) 删除指定键值对。
4、使用 localStorage.clear() 清空当前域名下所有 localStorage 数据。
四、使用 Fetch API 发起网络请求
Fetch API 是现代浏览器中替代 XMLHttpRequest 的标准异步请求接口，返回 promise 对象，支持 jsON、文本、流等多种响应类型。
1、调用 fetch(“https://api.example.com/data”) 发起 GET 请求。
2、使用 response.json() 解析响应体为 json 对象。
3、使用 response.text() 获取纯文本响应内容。
4、发起 POST 请求时，在选项中传入 method: “POST” 和 body: JSON.stringify(data)。
五、使用 MediaDevices API 访问摄像头与麦克风
MediaDevices API 提供对用户媒体输入设备（如摄像头、麦克风）的访问控制，常用于视频通话、图像采集等应用。
1、调用 navigator.mediaDevices.getUserMedia({ video: true, audio: true }) 请求权限。
2、将返回的 Mediastream 对象赋值给 元素的 srcObject 属性。
3、使用 stream.getTracks() 获取所有媒体轨道。
4、调用 track.stop() 手动停止某条轨道以释放设备资源。