有没有办法/返回用图像替换 ajax 文本

Question

我有一个 HTML 网页，每秒使用 ajax 显示一些传感器读数，我想用图像替换文本（base64 除外，因为太大了）。

所以我发送 ajax（无缓存）的代码是这样的：

print("<analog>");
if (h <= 50) {
print("sunny");
} else if (h >= 75) {
print("storm");
} else {
print("cloud");
}
print("</analog>");

...所以会在网页上打印模拟标签中的“sunny”、“cloud”或“storm”，但如果我查看页面源代码只写

<analog> </analog>

我无法将文本转换为图像，例如 <img src... sunny.gif> 的“sunny”

有没有办法强制用图像替换 ajax 文本？

非常感谢您的帮助！

Answer 1

您的代码应输出如下内容：

<analog value="sunny" />
<analog value="storm" />
<analog value="cloud" />

然后在 CSS 中，您将能够将其设置为：

analog { display:block; }
analog[value="sunny"] { background-image:url(...sunny.gif); }
analog[value="storm"] { background-image:url(...storm.gif); }
analog[value="cloud"] { background-image:url(...cloud.gif); }