如何使用 jQuery 获取 HTML 元素的真实 ID？

Question

我想获得 HTML 元素的真实（未更改）ID。 我的意思是，例如，我有这行 HTML：

<p id='1'>Something in paragraph</p>

如果用户在 Chrome 或其他浏览器中使用开发人员工具并将此<p>标记的 id 更改为“2”，我如何获取此元素的过去（和真实）id？

我使用了这个，但它仍然给出了更改后的 ID。

 $("input").attr('id');

非常感谢您！

Answer 1

答案很简单，只需要修改时间旅行和DOM的基础知识（ 文档Object Model ）

当用户将 id 的值从 '1' 更改为 '2' 时，实际上您已经从id=1到id=2 '1' 已被用户从存在中删除，id 的当前值为 ' 2'（实际值），dom 只知道这个值。 因此，您只能获取 dom 实际知道的那些值，即仅当前值

$("input").attr('id');

这是获取 id 值的正确方法

Answer 2

您可以将data-id元素附加到 html 元素以获取原始值。

 $("p").attr("id", 2); console.log($("p").attr('id')); console.log($("p").data('id'));

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <p id="1" data-id="1">Something in paragraph</p>

Answer 3

您必须在更改之前跟踪原始 ID，您可以将该旧 ID 分配给元素的数据属性或在代码中作为变量。