如何获取dom元素的代码行号？答案

【问题标题】：how to get the code line number of a dom element?如何获取dom元素的代码行号？
【发布时间】：2012-08-21 05:15:12
【问题描述】：

如何找到特定 DOM 元素的代码行号？

所以我在 JS 变量中有一个 DOM 元素，我需要一个函数来返回代码行号和文件名（路径）

【问题讨论】：

【解决方案1】：

这是不可能的，因为你可以操纵 dom。

两个原因：

浏览器在解析 dom 时添加了 dom 元素（如<tbody> 导致大多数人忘记它）浏览器还可以自动更正未关闭的标签等，因此无法定义 dom 节点在哪一行。
您可以使用 javascript 添加/追加/操作/删除 dom 节点。 dom 不是静态的。只要您执行以下操作：var foo = document.createElement("div"); 并将其附加到正文中，例如：document.body.firstChild.appendChild(foo);，行号就会在逻辑上发生变化。

您还可以在树中移动 dom 节点，例如更改元素的父级等。您也可以创建 dom 节点而不将它们附加到树中，但您可以在以后的过程中附加它们。

简单地说：除非您安装了检查器（例如右键单击可视浏览器窗口中的节点并在 chrome 中选择“检查元素”之类的内容），否则您无法确定 dom 节点在哪一行。

每个浏览器对 html / dom 的解释都不同，因此不可能有相同的结果树。

您唯一能做的就是添加一个引发异常的<script> 标记。在大多数浏览器中，您可以通过警告框显示当前行号。（因为我认为那“不是一个好主意”，所以我不会详细说明）

【讨论】：

不是不可能，只是没有实现。
@amn 虽然这个答案来自 2012 年，但我仍然不同意这一点。你说它没有实现。我说我已经阅读了 chromium、v8 和 spidermonkey 的源代码。异常是访问引擎堆栈以提取文件名和行号的唯一方法。其他一切都是“黑客”。就像获取文件并对其进行比较。（解析行，分配行号，......）但这需要了解所有请求的文件。（如果不预先解析你无法放置的钩子，因为你无法突破浏览器沙箱，这是非常不可能知道的）......所以你..我不同意......
此外，这没有用例。这就是为什么这从未实施过。
我可以想象的一个用例是您的应用程序需要解析一个设计为由用户键入的 XML。当所说的 XML 包含解析器会阻塞的错误时，您希望向用户显示一条友好的消息，提醒他们注意这一事实，并将他们指向错误的大致附近，这是行号派上用场的地方。
dom 不是 xml，即使您可以将其字符串化为 xml。就原始 xml 而言，我同意。这很容易解析，但由于 dom 中的动态对象插入会弄乱行数，除此之外还会增加管理状态所需的内存占用，所以你不能这样做。这也是内联 javascript 中断时看不到行号的原因。