Javascript HTML 元素的唯一标识符
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3298500/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Unique identifier for HTML elements
提问by Omar Abid
Besides of the ID, if you say, you want a unique identifier for an HTML element (let say a div).
除了 ID，如果你说，你想要一个 HTML 元素的唯一标识符（比如一个 div）。
I browsed the DOM for something (like a number or string) that is unique for each element; but the DOM is big and I failed to find that in the Internet.
我在 DOM 中浏览了每个元素唯一的东西（如数字或字符串）；但是 DOM 很大，我在 Internet 上找不到。
Is there any property (in the DOM obviously) that is unique only to that element? (Other than the ID and also you don't specify it, but comes when the DOM is constructed)
是否有任何属性（显然在 DOM 中）是该元素独有的？（除了ID，你也没有指定它，而是在构建DOM时出现）
采纳答案by RoToRa
As Pekka says, it would be easier if you would describe what you want to do. Until then here are two suggestions.
正如 Pekka 所说，如果你能描述你想做的事情会更容易。在此之前，这里有两个建议。
Unless you actually need to express the id as some kind of string you can save the normal DOM reference.
除非您确实需要将 id 表示为某种字符串，否则您可以保存普通的 DOM 引用。
If you do need to express it as a string for some reason, then you'll need to assign a unique id yourself.
如果出于某种原因确实需要将其表示为字符串，那么您需要自己分配一个唯一的 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;
};
}());
回答by Gordon
The only other identifier I can think of is the XPath of the element in the document.
我能想到的唯一其他标识符是文档中元素的 XPath。
For instance, the title link inside the heading of this very page has an XPath of
例如，这个页面标题内的标题链接的 XPath 为
/html/body/div[3]/div[2]/div/h1/a
But like Pekka already said, it depends on what you want to do. And I dont think you can get the Xpath easily from the DOM in JavaScript, despite Xpath being available nowadays in JS engines.
但就像 Pekka 已经说过的，这取决于你想做什么。而且我不认为您可以轻松地从 JavaScript 的 DOM 中获得 Xpath，尽管 Xpath 现在在 JS 引擎中可用。
回答by DonO
Internet explorer has a property "uniqueID" for every element. The problem is that the other browsers don't support it.
Internet Explorer 的每个元素都有一个属性“uniqueID”。问题是其他浏览器不支持它。
回答by Pekka
There is the nameattribute that can be addresses by document.getElementByName.
有一个name属性可以被寻址document.getElementByName。
I don't think other unique identifiers exist - even though you could simulate one by setting a property (like title) to a unique value, and then query for that. But that is kludgy.
我认为不存在其他唯一标识符 - 即使您可以通过将属性（如title）设置为唯一值来模拟一个，然后查询它。但这很笨拙。
What exactly do you need this for? If you give more information about your situation, somebody will probably come up with a suggestion.
你到底需要这个做什么？如果你提供更多关于你的情况的信息，有人可能会提出建议。
回答by risto
You can use a library or roll your own to create a unique identifier. JQuery has .data():
您可以使用库或自行创建唯一标识符。JQuery 有.data()：
Store arbitrary data associated with the matched elements or return the value at the named data store for the first element in the set of matched elements.
存储与匹配元素关联的任意数据，或在命名数据存储中返回匹配元素集中第一个元素的值。
回答by AsGoodAsItGets
I just encountered the same situation, and while I was looking into some DOM elements in the Chrome dev tools inspector, I noticed that they all seem to have a property like jQuery11230892710877873282assigned with a unique number. Obviously the number after 'jQuery' is different every time you load the page, my guess is that jQuery is generating this internally every time it tries to access or manipulate any DOM element. I played a little bit with it, and it looks like elements that are never accessed/manipulated by jQuery may not have this property, but the moment you do something like $(elem)the property will be there. So, since we're using both jQuery and lodash, I devised the following function to return a unique ID regardless of whether the element actually has a DOM id attribute.
我刚刚遇到了同样的情况，当我在 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)
