jQuery 添加自定义 Html 属性可以吗？

Is it alright to add custom Html attributes?

提问by Donny V.

I have a site I'm working on where I want to mark if a row of data has been changed. If something has been changed in that row I would mark it with a custom attribute like so.

我有一个正在处理的站点，如果一行数据已更改，我想标记该站点。如果该行中的某些内容发生了更改，我会使用这样的自定义属性对其进行标记。

<tr>
  <td isDirty="true">
     ....row data
  <td>
</tr>

This works great with jQuery and it doesn't add to much code to my page.

这对 jQuery 非常有效，并且不会向我的页面添加太多代码。

But is this really the correct way of doing something like this and what are the downsides?

但这真的是做这样的事情的正确方法吗？有什么缺点吗？

I guess another way of doing this would be like this, but it seems like over kill.

我想另一种这样做的方法是这样的，但它似乎过度杀戮。

<tr>
  <td>
     ....row data
     <input id="isDirty" type="hidden" value="true" />
  <td>
</tr>

回答by tanathos

Why don't you use the jQuery data capability?

为什么不使用 jQuery 数据功能？

Your example will be (I don't know the condition to select proper td):

您的示例将是（我不知道选择正确 td 的条件）：

$("tr td").data("isDirty", true);

take a look at documentation

看一下文档

回答by AAA

Technically you should be using the classattribute for this. Tags can have more than one class so it shouldn't affect anything

从技术上讲，您应该为此使用class属性。标签可以有多个类，所以它不应该影响任何事情

<td class="isDirty otherclass">

回答by EndangeredMassa

HTML 5 supports custom attributes prefixed with "data-". So, I would use that to be forward-compatible.

HTML 5 支持以“data-”为前缀的自定义属性。所以，我会用它来向前兼容。

As for earlier versions, I don't think it will validate, but I wouldn't worry about that. I've heard that some browsers may ignore these tags, though. So, be sure to test it all around.

至于早期版本，我认为它不会验证，但我不会担心。不过，我听说有些浏览器可能会忽略这些标签。因此，请务必对其进行全面测试。

回答by AnthonyWJones

Sticking to the standards for the sake of sticking to the standards is a bad reason to stick to standards.

为了坚持标准而坚持标准是坚持标准的糟糕理由。

Your page specifies the DTD, your server specifies the mimetype. As long as you aren't sending real xhtml there is no reason not use expando attributes in this way. It can be very helpful.

您的页面指定 DTD，您的服务器指定 mimetype。只要您不发送真正的 xhtml，就没有理由不以这种方式使用 expando 属性。它可能非常有帮助。

Ok so your page won't 'validate' if you need to care about that then don't do it.

好的，如果您需要关心，那么您的页面将不会“验证”，然后不要这样做。

Just don't be seduced by IEs 'conveniant' elem.isDirty method of accessing such values. Always use elem.getAttribute('isDirty') to access the value.

只是不要被 IE 访问这些值的“方便”elem.isDirty 方法所诱惑。始终使用 elem.getAttribute('isDirty') 来访问该值。

回答by Genericrich

This will prevent your page from validating I think, since you are adding custom attributes that the validators won't know about.

我认为这将阻止您的页面验证，因为您正在添加验证器不知道的自定义属性。

You might be able to do this with your own DTD or schema, but that's more work.

您也许可以使用自己的 DTD 或模式来完成此操作，但需要做更多的工作。

Your second example is the right way to do this I think. The right direction anyway.

你的第二个例子是我认为正确的方法。反正方向是对的。

回答by aivarsak

I strongly recommend to stick to standards. Web is already messed up ;)

我强烈建议坚持标准。网络已经搞砸了;)

回答by kgiannakakis

I believe that there is not a "Yes" or "No" answer to your question. Using custom attributes will help you have cleaner and shorter code in many circumstances. Your example is trivial and I believe that it can't demonstrate the power and flexibility of this technique. Specifically you are dealing with a boolean attribute, which most likely has to do with appearance. These kind of things are better handled with a class. However, with custom attributes you could add context to your nodes. You could use this context to do some calculations. For example, add a price or a weight attribute to the nodes of the list. You then later use these fields to calculate the sum or average. I am sure that there are many better than this examples out there.

我相信您的问题没有“是”或“否”的答案。在许多情况下，使用自定义属性将帮助您拥有更清晰、更短的代码。你的例子很简单，我相信它不能证明这种技术的力量和灵活性。具体来说，您正在处理一个布尔属性，这很可能与外观有关。这些事情最好用一个类来处理。但是，使用自定义属性，您可以向节点添加上下文。您可以使用此上下文进行一些计算。例如，向列表的节点添加价格或权重属性。然后您稍后使用这些字段来计算总和或平均值。我相信有很多比这个例子更好的例子。

On the other hand custom attributes will prevent the html from passing validation testing. This is an important problem and it may get even more important in the future.

另一方面，自定义属性将阻止 html 通过验证测试。这是一个重要的问题，未来可能会变得更加重要。

回答by jishi

Using custom attribute is useful from several points of view, but be sure to avoid namespace-collision by using a prefix:

从多个角度来看，使用自定义属性很有用，但请务必通过使用前缀来避免命名空间冲突：

<td custom:isDirty="true">

<td custom:isDirty="true">

Otherwise it might clash with future implementations.

否则它可能会与未来的实现发生冲突。

As a sidenote, a DOM-element can have custom properties like any other js-object, meaning that if you create nodes dynamically you can still add custom data of any type to your element, without affecting the validation.

作为旁注，DOM 元素可以像任何其他 js 对象一样具有自定义属性，这意味着如果您动态创建节点，您仍然可以向元素添加任何类型的自定义数据，而不会影响验证。

var element = document.createElement('div');
element.myCustomObject = { foo: "bar", someFunction: function () { alert('foobar'); }};

document.body.appendChild(element);

Of course, the above doesn't make sense to people that never done clientside scripting without frameworks like jQuery, prototype etc... :)

当然，对于那些从未在没有 jQuery、prototype 等框架的情况下进行客户端脚本编写的人来说，上述内容没有任何意义...... :)

回答by Steve Perks

isDirty is a perfect example of how a class should be named. Class names should be semantic, and I can't think of a better way of assigning a class to describe what it is about that element (other than to use title if you want to share that information with the end user)?

isDirty 是一个类应该如何命名的完美例子。类名应该是语义化的，我想不出更好的方法来分配一个类来描述它与该元素有关的内容（如果您想与最终用户共享该信息，除了使用标题之外）？

You shouldn't set your own attributes unless you're willing to maintain your own DTD.

除非您愿意维护自己的 DTD，否则不应设置自己的属性。

回答by SpoonMeiser

Adding arbitrary attributes will mean that your HTML is no longer valid.

添加任意属性将意味着您的 HTML 不再有效。

If you are using XHTML, however, I think you can add attributes that have a different XML namespace, which won't cause validation problems.

但是，如果您使用 XHTML，我认为您可以添加具有不同 XML 名称空间的属性，这不会导致验证问题。

I don't know a great deal about this, but thought I'd mention it as no one else has. Perhaps someone else could expand on, or refute, this if they have a better understanding?

我对此知之甚少，但我想我会像其他人一样提及它。如果他们有更好的理解，也许其他人可以扩展或反驳这一点？