用 html 和js写一个可以被调用的图片接口

以下是一个简单的图片接口，使用HTML和JavaScript编写：

HTML代码：

<!DOCTYPE html>
<html>
<head>
	<title>图片接口</title>
</head>
<body>
	<h1>图片接口</h1>
	<p>
		<button onclick="getRandomImage()">随机图片</button>
	</p>
	<div id="image-container">
		<!-- 图片将显示在这里 -->
	</div>

	<script src="image-api.js"></script>
</body>
</html>

JavaScript代码（保存为image-api.js文件）：

function getRandomImage() {
	// 创建一个新的 Image 对象
	var img = new Image();

	// 设置图片的 src 属性为接口地址
	img.src = "https://picsum.photos/400/300/?random";

	// 将图片添加到页面上
	document.getElementById("image-container").appendChild(img);
}

当用户单击“随机图片”按钮时，getRandomImage()函数将创建一个新的Image对象，并将其src属性设置为图片接口地址。然后，该图片将被添加到页面上的image-container元素中。

注意，这个简单的例子只是演示了如何使用HTML和JavaScript创建一个基本的图片接口。在实际应用中，您可能需要更复杂的代码来处理不同的图片请求和数据传输