提问人：Pekka 提问时间：11/24/2009 更新时间：7/10/2014 访问量：4139
如何以有效的方式添加非标准属性
How to add non-standard attributes in a valid way
问：
有没有办法拥有非标准属性，例如
onselectstart
oncontextmenu
...
，并且仍然以某种方式通过验证作为 HTML 4.01 过渡？
除了稍后使用 Javascript 添加属性。
答：
2赞
Ben Shelock
11/24/2009
#1
不，您必须更改文档类型。
<!DOCTYPE HTML>
该文档类型将允许您使用自己的属性。这是一篇关于此事的好文章
评论
2赞
Quentin
11/24/2009
这仅允许您使用以数据开头的自定义属性，而该示例使用无法以这种方式表示的专有属性。该问题还指定了 HTML 4.01 Transitional（HTML5 不是）。
0赞
Ben Shelock
11/24/2009
这就是为什么我在这个问题开始时没有，但指定了一个替代方案。
0赞
Chuck
11/24/2009
@Ben：重读大卫的评论。他说你的选择是错误的。
2赞
Quentin
11/24/2009
#2
不，不是。在仍然符合语言的同时，没有向语言添加内容的余地。
5赞
Vincent Robert
11/24/2009
#3
使用这些属性将生成无效的文档。
稍后使用 Javascript 添加这些属性将生成无效文档（即使 W3C 验证器无法告诉您）。
但 W3C 从不反对使用专有扩展。验证不应是必需的。这是一种在不符合规范时告诉您的方法。W3C 不会仅仅因为无效页面而发送 FBI。
如果您依靠专有扩展来为您的访问者提供更好的体验（但不依赖它），那么您就走在了正确的道路上：-）只是祈祷（或贡献）那些在下一个规范中。
现在，如果它是关于防止浏览器上下文菜单或选择，那只是粗鲁的！别这样！
评论
1赞
Pekka
11/24/2009
即使在后端，我也开始关心验证，因为它可以更容易地检测错误。对于适当的工作流程，我希望在没有什么可修复的地方看到绿灯（验证器）灯，当有时看到红灯。这就是为什么我想删除哪怕是最小的无效。“oncontextmenu”是完全无辜的，绑定到一个 DIV，别担心:)
0赞
Vincent Robert
11/24/2009
我从来没有想过让你因为代码无效而感到内疚。您似乎以正确的方式使用验证：检测编码错误。现在，对于您的特定问题，您的后端验证可以针对这些属性提供特定情况，然后发出警告？这将允许“中途通过”，同时仍然检测真正的错误。
0赞
Vincent Robert
11/24/2009
我所说的实际错误是指重要的错误，例如无效的结构或拼写错误的属性，这些错误可能真的会搞砸渲染并让您浪费时间。
0赞
BryanH
8/9/2012
现在，如果它是关于阻止浏览器上下文菜单或选择，你就是在浪费你的时间，因为你只会阻止菜鸟（FIFY）
6赞
Matt Ryall
11/24/2009
#4
虽然您无法在 HTML 4.01 中添加自己的标记或属性，但一种常见的技术是使用标准 HTML 标记或属性来包含您的信息，即使根据规范，它并不完全正确。例如，“class”属性几乎可以存储任何类型的数据：
<a href="#" id="user-link-1" class="username:matt email:[email protected]">Matt</a>
您可以检索上述链接的类，并将“class”属性拆分为检索数据。
我见过一些用于自定义数据的其他标签和属性：具有非 JavaScript “type”值的标签、隐藏的输入值、各种标签上的“title”属性。<script>
如果您不介意从 HTML 4 更改，您还有其他几个选项：
- 使用 HTML 5，它支持以“data-”开头的自定义属性
- 使用 XHTML，它通过 XML 命名空间支持自定义标记和属性。
您还可以在运行时通过 JavaScript 向 HTML 文档添加自定义属性。例如：
var body = document.getElementsByTagName("body")[0];
body["my-attribute"] = "Hello, world!";
alert(body["my-attribute"]);
如果您的信息是动态的，并且根本不需要存储在标记中，这会很有帮助。
评论
0赞
Pekka
11/24/2009
谢谢，但就我而言，它是关于增强用户体验的 （IE） 特定标签，所以我无法将值存储在其他属性中。
0赞
James Heazlewood
7/10/2014
#5
我过去做过的一件事是使用“数据”，它通常用于幻灯片等。但是，写出您需要的数据，就像在“style”属性中一样。
<div class="your_element" data="onselectstart:foo;oncontextmenu:bar;">
</div>
然后使用 jquery 获取数据：
var onSelectStart = getData($(".your_element"), "onselectstart");
功能：
//
function getData(elementObject, indexString)
{
var dataElements = elementObject.attr("data").trim().split(";");
var result = dataElements.some(function(entry) {
dataArray = entry.trim().split(":");
if(dataArray[0] == indexString)
{
found = dataArray[1].trim();
return true; // return from "some"
}
});
return result ? found : false;
}
无效并不是世界末日，正如其他几个人所提到的。就像我说的，“数据”是常用的，它甚至在某些IDE中被突出显示为有效。
评论