【问题标题】:Unique identifier for HTML elementsHTML 元素的唯一标识符
【发布时间】:2011-03-18 22:19:18
【问题描述】:

除了 ID,如果你说,你想要一个 HTML 元素的唯一标识符(比如说一个 div)。

我在 DOM 中浏览了每个元素唯一的东西(比如数字或字符串);但是 DOM 很大,我在 Internet 上找不到。

是否有任何属性(显然在 DOM 中)仅对该元素是唯一的? (除了ID,你也没有指定它,而是在构造DOM时出现)

【问题讨论】:

  • FWIW,IE 提供了一个uniqueID property DOM 对象,当访问该对象时,会为该元素生成一个唯一标识符。它不是规范的一部分,但不会在其他浏览器中为您提供帮助。
  • 我创建了一个 gist 并带有一个 shim,它将 IE 的 uniqueID 功能添加到其他浏览器。

标签: javascript html dom


【解决方案1】:

正如 Pekka 所说,如果你能描述一下你想做什么会更容易。在此之前,这里有两个建议。

除非您确实需要将 id 表示为某种字符串,否则您可以保存普通的 DOM 引用。

如果您出于某种原因确实需要将其表示为字符串,那么您需要自己分配一个唯一的 id。

var getId = (function () {
  var incrementingId = 0;
  return function(element) {
    if (!element.id) {
      element.id = "id_" + incrementingId++;
      // Possibly add a check if this ID really is unique
    }
    return element.id;
  };
}());

【讨论】:

  • 既然您使用的是 jQuery,我应该让您知道它的 data 函数,您可以使用它为元素分配任何类型的信息:api.jquery.com/data 实际上 jQuery 本身使用一个 unqiue ID 来实现它,但是我不确定是否可以以任何可靠的方式访问该 ID。
【解决方案2】:

我能想到的唯一其他标识符是文档中元素的 XPath。

例如,该页面标题内的标题链接的 XPath 为

/html/body/div[3]/div[2]/div/h1/a

但是就像 Pekka 已经说过的,这取决于你想做什么。而且我不认为你可以很容易地从 JavaScript 中的 DOM 中获取 Xpath,尽管 Xpath 现在可以在 JS 引擎中使用。

【讨论】:

  • @Andy Xpath 在现代浏览器中可用。我只是不认为有一种方法可以通过某种本机函数将 Xpath 获取到节点。至少我不知道。
  • @AndyE 我认为它是时候成为 W3C 推荐的时候了,你不觉得吗?它对于操作 DOM 非常有用。
  • @risto 我认为主要问题是 DOM 很少是完全静态的并且从根到目标元素是可预测的。对 DOM 的任何更改都会使您以前获得的 xpath 无用,仅依赖类名、唯一​​ ID 或使用相对于具有这些属性的元素的选择器会更安全。
  • @AndyE XPath 对于端到端测试非常有用,您知道应该何时以及如何操作 DOM。不必依赖像 Selenium 这样的 IDE 会很好
【解决方案3】:

Internet Explorer 对每个元素都有一个属性“uniqueID”。问题是其他浏览器不支持。

【讨论】:

    【解决方案4】:

    name属性可以是document.getElementByName的地址。

    我认为不存在其他唯一标识符 - 即使您可以通过将属性(如 title)设置为唯一值来模拟一个,然后查询该值。但这很笨拙。

    你到底需要这个做什么?如果你提供更多关于你的情况的信息,有人可能会提出建议。

    【讨论】:

    • 寻找类似于原型中的识别功能的解决方案。不幸的是,我使用的是 jQuery。我想我最好创建自己的识别函数。
    【解决方案5】:

    您可以使用库或自行创建唯一标识符。 JQuery 有.data():

    存储与匹配元素关联的任意数据或返回 集合中第一个元素在命名数据存储中的值 匹配的元素。

    【讨论】:

      【解决方案6】:

      我刚刚遇到了同样的情况,当我在 Chrome 开发工具检查器中查看一些 DOM 元素时,我注意到它们似乎都有一个像 jQuery11230892710877873282 这样的属性,并分配了一个唯一的编号。显然,每次加载页面时,'jQuery' 后面的数字都不同,我的猜测是 jQuery 每次尝试访问或操作任何 DOM 元素时都会在内部生成它。我用它玩了一点,看起来从未被 jQuery 访问/操作的元素可能没有这个属性,但是当你做类似$(elem) 的事情时,这个属性就会在那里。因此,由于我们同时使用 jQuery 和 lodash,我设计了以下函数来返回唯一 ID,而不管元素是否实际具有 DOM id 属性。

      _.reduce($(elem), function(result, value, key) { if(_.startsWith(key, 'jQuery')) return value; }, 0)
      

      【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2023-03-17
      • 2020-03-25
      • 1970-01-01
      • 2019-03-26
      • 1970-01-01
      • 2014-02-15
      • 1970-01-01
      相关资源
      最近更新 更多