便宜VPS测评
要将 JSON 数据输出到 HTML 页面，你可以使用 JavaScript 来处理和呈现 JSON 数据。以下是一个基本的示例：
HTML 部分：
<!DOCTYPE html>
<html>
<head>
<title>JSON 数据输出</title>
</head>
<body>
<h1>JSON 数据输出</h1>
<div id="json-container"></div>
<script src="script.js"></script>
</body>
</html>
JavaScript（script.js）部分：
// 假设这是从服务器获取的 JSON 数据
var jsonData = {
name: "John",
age: 30,
city: "New York"
};
// 获取用于输出的容器元素
var jsonContainer = document.getElementById("json-container");
// 创建一个 <pre> 元素用于显示 JSON 数据
var preElement = document.createElement("pre");
preElement.textContent = JSON.stringify(jsonData, null, 4);
// 将 <pre> 元素添加到容器中
jsonContainer.appendChild(preElement);
在上述示例中，我们首先创建了一个 HTML 页面，其中包含一个 <div> 元素用于容纳 JSON 数据。然后，在 JavaScript 中，我们假设从服务器获取到一个 JSON 对象 jsonData。接下来，我们使用 document.getElementById() 获取页面中的 <div> 元素，并将其赋值给 jsonContainer 变量。然后，我们使用 document.createElement() 创建一个 <pre> 元素，该元素用于显示格式化后的 JSON 数据。我们通过设置 <pre> 元素的 textContent 属性为经过 JSON.stringify() 格式化的 JSON 字符串来填充它。最后，我们使用 appendChild() 将 <pre> 元素添加到 <div> 容器中。
当你在浏览器中打开该 HTML 文件时，你将看到 JSON 数据以格式化的形式输出到页面上。你可以根据需要修改样式和脚本来实现更复杂的 JSON 数据输出效果。
