其他人如何看待使用“自定义”属性来使事情变得更容易（在 jQuery 中）

Question

我目前正在jQuerifying（如果有这样一个词）我的网站。我一点也不擅长 JavaScript，也不擅长 jQuery。面向对象在 JS 中已经过时了，但我网站的其余部分是面向对象的 VB.net。我注意到，根据我不久前使用 jQuery 的一些经验，加载特定行的页面时有多么困难 - 您必须以某种方式找出要提交的 ID 以及类似的东西。

就在最近我尝试使用类似的东西：

<li class="catalogueItem"><a pName='" & Product.Name & "' pID='" & Product.ID & "'>" & Product.Name & "</a></li>

好吧，这并不完全相同 - 我添加了类似的东西作为文字控件，但目前屏幕上没有代码，所以我只是写了类似的东西。

无论如何，我随后尝试了以下操作：

$("li.catalogueItem").click(function() {
    $(this).html($(this).find("a").attr("pID"));
});

根据我的发现，这应该可以正常工作。所以我的问题如下：a) 使用这种技术有问题吗？b) 其他人如何看待这项技术？c) 在其他人看来，尽管 HTML 不符合 W3C 等标准，但使用这种技术是否可以？d）任何人都可以向我指出一种更有效或更简单，或者甚至更困难/复杂但被广泛接受的方法来做这种事情吗？

请记住，产品可能有很多属性，我可以在管理前端使用它通过拖放界面重新排列产品。

提前谢谢了。

问候，

理查德

给鲁本斯的笔记相当长……

我不知道你以前是否曾经做过任何VB.Net，但我找不到一种方法来创建服务器端脚本标签，然后说：

ScriptTag.Controls.add(New LiteralControl("$('#" & MyDiv.clientID.toString & "').data('ProductName', '" & Product.Name & "');"))

我已经尝试过，但我能找到的唯一方法是将脚本存储在服务器端（可能在数组中），然后覆盖页面渲染事件（此时所有脚本都将被添加到数组中）以将这些输出到一个脚本标签中，或者更可怕的是，让 head 标签在服务器上运行，然后每次我需要输出另一段脚本时添加一个脚本标签。无论采用哪种方式实现这些技术都会导致要么花费很长时间来实现这样的方法，要么导致带有许多脚本标签的可怕的长头标签。

我认为开发人员应该尽可能遵守指南 - 因此我将脚本标签保留在它们所属的头部。

我建议的方式可以“即时”完成 - 并且无论是否需要脚本都会加载脚本（它们在母版页的 head 标签中指定）。

我所建议的方式有很多优点，因为它更容易编码（根据我的经验）并且可以更快地编码。

我刚刚想到的一件事......我在 Visual Studio 中看到过一种叫做 ScriptManager 的东西...我想知道这是否与将脚本保存在一个地方有关......也许是时候做一些调查了......如果我想到其他任何事情，或者了解有关这两种方法的任何其他信息（优点和缺点等），我会在这里发帖。

理查德

Answer 1

如果您要使用自定义属性，我会说使用 data- 属性, ， 像这样：

<li class="catalogueItem"><a data-pName='" & Product.Name & "' data-pID='" & Product.ID & "'>" & Product.Name & "</a></li>

在 HTML5 中 data- 前缀属性用于 确切地 这个目的...但不会对 HTML4 文档造成任何问题（尽管它们在技术上是无效的）。现在您可以像这样访问它们：

$("li.catalogueItem").click(function() {
  $(this).html($(this).find("a").attr("data-pID"));
});

在即将到来的 jQuery 1.5 中， .data() 将要 寻找他们作为后备 同样，像这样：

$("li.catalogueItem").click(function() {
  $(this).html($(this).find("a").data("pID"));
});

Answer 2

所有现代浏览器不会抱怨这个使用无效的HTML。这就是说，它仍一直困扰着我。这是很常见的，看在HTML中使用相对属性来存储数据。我还常常钉在的东西的 ID 属性的ID：     <a id="product-384">My Product</a>

一旦你在JavaScript / jQuery的境界的时候，也最好使用jQuery的数据（）方法。 请参阅 http://docs.jquery.com/Data

Answer 3

由于科里斯加格里亚蒂写的是更好地利用jQuery.data（ HTTP：//docs.jquery的.com /数据）来存储，并且在任何HTML节点读取数据。

使用jQuery.data方法会增加你一些额外的代码（见工作）。其主要思想是，你可以使用一键保存JavaScript对象的HTML。

示例：

$('li.catalogueItem item-0').data('item', {id:0, name:'My Item', desc:'...'});

有关实际的.NET代码，你就会被推向写的每个项目这个前面的例子。使用循环将做的工作。

Answer 4

作为 缺口 解释说，这是 jQuery 即将推出的功能，您应该坚持使用它，因为它也是有效的 HTML5 代码。

但我知道您要求的是个人经验，而不是技术理由。

因此，根据我的经验，请根据需要尽可能多地使用它们。

HTML 从第一天起就被破坏了，它缺少了很多有用的功能，但好消息是您可以在不破坏功能的情况下解决其中的大多数问题。

我有这条规则，如果你正在构建和应用程序，而不是 民众 网站（将被广泛且未知的受众使用），并且您可以拥有一个受控环境（您可以告诉应用程序用户他们应该使用什么浏览器），尽一切努力使您的应用程序变得更好，那就是对客户更好，对 你 开发/维护/更新。

规格总是在变化，并且它们总是引入已经在使用的功能；）