在Chrome开发者工具的元素窗口中获取行号？

Question

在Chrome中，工具 - ＆gt;开发人员工具 - ＆gt;元素选项卡。源代码旁边没有行号。有没有办法切换它们？

Answer 1

无法在开发者区域显示数字行。您可以在要查看代码行的网页中按 CTRL + U 。 祝你好运

Answer 2

不知道它有多么有用，但您可以右键单击Elements选项卡中的html元素，选择“Copy as HTML”并将结果粘贴到您喜欢的文本编辑器中。这将为您提供DOM的行号，因为它存在于您复制它的位置。

与评论一样，这与源代码行号不对应。

Answer 3

如果您转到“查看页面来源”，则会显示当前行号。右键单击 - ＆gt;查看页面源，或在Windows上按 Ctrl + U ，或 Cmd + 选项 + U < / kbd>在Mac上。

为了它的价值，我需要这个，因为我收到了一个带行号的javascript错误。开发工具没有在常规源选项卡中显示这个片段，大概是因为它嵌入在HTML中，我有一个编译错误（愚蠢的缺少逗号）。

Answer 4

它没有行号，因为它是HTML代码的已解析和更正版本，行号可能与您在代码编辑器中看到的非常不同。找到完全相同元素的最佳方法是向元素添加ID属性，然后使用document.querySelectorAll（'＃CUSTOM_ID'）; 如果要查看未更改的HTML（从服务器接收的浏览器），只需右键单击页面并选择查看页面源。

Answer 5

按“ F12”或进入开发人员工具。单击“源”选项卡，双击左侧窗格中已选择的文件。请在下面查看此网页的屏幕截图。

Answer 6

尝试使用Chrome扩展程序 Go to line ：

Answer 7

我不知道自发布以来Chrome DevTools是否发生了变化，但您现在可以这样做：

通过单击它旁边的箭头展开错误，然后单击显示堆栈（...）的行，它将展开到相同的错误消息以及发生它的源行。

我希望这有帮助！