如何正确存储图像的描述信息

How do I properly store description information for an image?

本文关键字：描述 信息 图像 何正确 存储      更新时间：2024-01-03

我已经编写了一个用于显示图像的自定义灯箱。单击图像并打开灯箱后，我希望显示该图像的描述。我试图以最干净、最有效、最恰当的方式存储描述，但我无法决定该怎么做。

我曾考虑过使用自定义数据属性，但我发现：

"自定义数据属性用于存储页面或应用程序专用的自定义数据，对于这些数据，没有更合适的属性或元素。"

所以数据picinfo或其他一些自定义数据字段似乎不合适？还是完全合适，因为我的lightbox应用程序将访问必要的数据字段以显示正确的信息？

<img src="exampleimage.jpg" width="140" height="105" name="cool-image" data-picinfo="this was a beautiful day hiking the mountains"/>

实现我想要做的事情的最佳和最恰当的方式是什么？

我会使用'alt'属性进行图像描述。Alt-text不仅确保图像标签符合W3C的可访问性标准，而且还适用于您想要实现的目标。

示例：

<img src="exampleimage.jpg" width="140" height="105" name="cool-image" alt="this was a beautiful day hiking the mountains" />

此时，您可以将该描述存储在javascript变量中，以便稍后显示，例如：

var imgDescription = document.getElementsByTagName('img')[0].getAttribute("alt");

希望能有所帮助！

在技术方面，title属性最接近"描述"。但真正重要的是你在那里有什么样的信息，你打算如何使用它，以及它是否在你的特殊用途之外有用

还有一个有争议的、很少使用的longdesc属性，它本应提供一个指向"长描述"的链接，但主要用于可访问性目的（尤其是对于根本看不到图像的人），并且它不包含在HTML5CR中。

根据您的需要，我认为没有更干净的方法可以做到这一点，您的灯箱需要从其他属性中获得描述，例如数据标题

<img src="exampleimage.jpg" width="140" height="105" name="cool-image" data-title="this was a beautiful day hiking the mountains" />

这有什么帮助：）

相关文章：