javascript web apis
JavaScript Web API指的是浏览器提供给JavaScript使用的一系列API集合，它们使JavaScript能够与浏览器交互并操作网页元素。这些API包括DOM API、CSSOM API、Canvas、XMLHttpRequest和Fetch等。

1. DOM API（文档对象模型）：允许JavaScript通过HTML和XML文档来访问和操作页面上的元素和内容。

例如，可以通过以下代码获取一个具有ID为“myDiv”的div元素：


var myDiv = document.getElementById("myDiv");


2. CSSOM API（CSS对象模型）：允许JavaScript通过样式表来更改文档中的样式。

例如，可以通过以下代码更改一个元素的背景颜色：


var myElement = document.getElementById("myElement");
myElement.style.backgroundColor = "red";


3. Canvas：允许JavaScript创建和操作位图画布。

例如，可以通过以下代码创建一个画布并在其上绘制一个圆：


var canvas = document.getElementById("myCanvas");
var context = canvas.getContext("2d");
context.beginPath();
context.arc(100, 75, 50, 0, 2*Math.PI);
context.stroke();


4. XMLHttpRequest和Fetch：允许JavaScript通过HTTP请求与服务器进行通信。

例如，可以通过以下代码发送一个GET请求并处理响应：


var xhr = new XMLHttpRequest();
xhr.open("GET", "/api/data", true);
xhr.onload = function() {
if (xhr.status === 200) {
console.log(xhr.responseText);
}
};
xhr.send();


或者可以通过以下代码使用Fetch发送一个GET请求并处理响应：


fetch("/api/data")
.then(response => response.text())
.then(data => console.log(data))
.catch(error => console.error(error));