Web API - 简介
JavaScript基础 2022-04-25 01:52:31小码哥的IT人生shichen
Web API - 简介
Web API 是开发人员的梦想。
- 它可以扩展浏览器的功能
- 它可以极大简化复杂的功能
- 它可以为复杂的代码提供简单的语法
什么是 Web API？
API 指的是应用程序编程接口（Application Programming Interface）。
Web API 是 Web 的应用程序编程接口。
浏览器 API 可以扩展 Web 浏览器的功能。
服务器 API 可以扩展 Web 服务器的功能。
浏览器 API
所有浏览器都有一组内置的 Web API 来支持复杂的操作，并帮助访问数据。
例如，Geolocation API 可以返回浏览器所在位置的坐标。
示例代码：
获取用户所在位置的经纬度：
const myElement = document.getElementById("demo");
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
myElement.innerHTML = "Geolocation is not supported by this browser.";
}
}
function showPosition(position) {
myElement.innerHTML = "Latitude: " + position.coords.latitude +
"<br>Longitude: " + position.coords.longitude;
}
完整实例：
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript 地理位置</h1>
<p>请单击按钮以获取您的坐标。</p>
<button onclick="getLocation()">试一试</button>
<p id="demo"></p>
<script>
const x = document.getElementById("demo");
function getLocation() {
try {
navigator.geolocation.getCurrentPosition(showPosition);
} catch {
x.innerHTML = err;
}
}
function showPosition(position) {
x.innerHTML = "Latitude: " + position.coords.latitude +
"<br>Longitude: " + position.coords.longitude;
}
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
第三方 API
第三方 API 未内置于您的浏览器中。
要使用这些 API，您必须从 Web 下载代码。
举例：
- YouTube API - 允许您在网站上显示视频。
- Twitter API - 允许您在网站上显示推文。
- Facebook API - 允许您在网站上显示 Facebook 信息。
