javascript - 这个 HTML 表示法是什么？我该如何使用它？

Question

AddThis 使用的符号似乎扩展了 HTML div 标记中可用的参数。

包含按钮数组的标记可以包含其他参数，例如:

<div addthis:url="someUrl"> </div>

除了为元素定义一些 css 类之外，似乎还赋予 JavaScript 代码访问权限来操作该元素并读取附加 addthis: 参数的值。

我想自己实现类似的东西，但对如何在标准 HTML 标记中正确允许附加参数感到困惑。

我还看到 AddThis 代码有时会抛出 W3C 验证错误，所以想知道这是否完全合法。

搜索周围我发现了一些关于通过扩展 JavaScript 中的原型(prototype)来扩展 HTML 标签的讨论，但我读到的所有内容似乎都是关于添加新事件等。

这个 addthis:url 符号对我来说看起来更像“模式”，或者我完全走错了路？

---

我已经在这方面取得了一些进展，至少在功能上是这样，但是我现在所取得的成果相当严重地破坏了 HTML 验证。

进一步解释我想要实现的目标......

与 AddThis 一样，您可以通过添加简单的 <DIV> 来包含他们的共享元素。标记到您的页面并包括一些 JavaScript，我想提供类似的功能 <IMG>标签。

想要使用此功能的人将包含 <IMG>标签有一些额外的名称=值对，这些对在标准图像标签属性之外并且由我的规范定义。

其中包含的 JavaScript 将读取这些附加属性并对图像标签执行一些操作。

为此，我有以下内容:

<IMG id="first image" class="imageThatCanBeWorkedOn" src="holding.png"
    my-API-name:attribute1="some data"
    my-API-name:attribute2="some other data">

然后，我使用 `getAttribute('my-API-name:attribute1') 从 JavaScript 访问附加标签数据。

(我将具有特定类名的所有标签选择到一个数组中，然后依次处理每个标签，以防有人感兴趣。)

这一切都很好 - 我可以操纵 <IMG>根据附加数据根据需要标记，但根据 W3C 验证器，标记不是有效的 HTML。

通过以上我得到:

Warning Attribute my-API-name:attribute1 is not serializable as XML 1.0.
Warning Attribute my-API-name:attribute2 is not serializable as XML 1.0.
Error: Attribute my-API-name:attribute1 not allowed on element img at this point.
Error: Attribute my-API-name:attribute2 not allowed on element img at this point.

如果我删除 :从属性名称(例如 my-API-name-attribute2)来看，“不可序列化”警告消失了，但我仍然收到“不允许”错误。

那么我如何将这些额外的数据位添加到 <IMG> 中标记而不是使标记无效，但同时通过以 AddThis 的方式包含“my-API-name”部分来保持一定程度的清晰度/品牌？

(我从评论中注意到我可以使用 data- 属性。我还没有尝试过这些，但我更愿意能够以“品牌”方式做到这一点，AddThis 似乎已经在没有打破了用户的加价。)

Answer 1

如果我们谈论 XML(包括 XHTML)，那么它就是命名空间前缀。在 HTML5 中，它只是一个 regular attribute :

Attribute names must consist of one or more characters other than the space characters, U+0000 NULL, U+0022 QUOTATION MARK ("), U+0027 APOSTROPHE ('), U+003E GREATER-THAN SIGN (>), U+002F SOLIDUS (/), and U+003D EQUALS SIGN (=) characters, the control characters, and any characters that are not defined by Unicode.

...虽然稍微难以操作( not too much, though )并且完全不标准。