Firefox开发工具在单击元素时高亮显示DOM节点

Firefox开发工具在单击元素时高亮显示DOM节点,firefox,firefox-developer-tools,Firefox,Firefox Developer Tools,要清楚的是,这并不是突出显示从DOM检查器到页面的元素,反之亦然。这是我以前从未见过的行为,但我通常使用Chrome 我正在调试一个文本区域,它不接受点击,不允许选择,也不以任何方式获得焦点。我注意到,单击页面中的textarea会导致Inspector中的几个DOM节点高亮显示,然后在一秒钟后消失。突出显示的节点都不是textarea;他们是文本区域的父母,包括身体,但不一定是文本区域和身体之间的所有父母。还有一位父母的兄弟姐妹 这是Firefox试图告诉我的事情之一,但我不知道是什么。我觉得

要清楚的是,这并不是突出显示从DOM检查器到页面的元素,反之亦然。这是我以前从未见过的行为,但我通常使用Chrome

我正在调试一个文本区域,它不接受点击,不允许选择,也不以任何方式获得焦点。我注意到,单击页面中的textarea会导致Inspector中的几个DOM节点高亮显示,然后在一秒钟后消失。突出显示的节点都不是textarea;他们是文本区域的父母,包括身体,但不一定是文本区域和身体之间的所有父母。还有一位父母的兄弟姐妹

这是Firefox试图告诉我的事情之一,但我不知道是什么。我觉得我最初问题的答案可能就包含在这个亮点中,只要我知道它的意思

在所附的屏幕截图中,您可以看到文本区域以蓝色突出显示,这是所选元素,以及其他一些元素上颜色相当粗糙的突出显示;这是在我点击文本区域之后(在页面中,好像我试图在其中输入一些文本;而不是在inspector中)


这意味着什么?

当标记视图中的节点(屏幕截图中的内容)高亮显示时,意味着这些节点经历了突变。这些可以采用以下方式:

  • 节点上的属性值更改
  • 添加/删除子节点
现在,您实际上在寻找一种方法来悬停文本框并获得标记视图来选择您的文本框,对吗

您可以通过两种方式实现这一点:

  • 点击快捷键Ctrl+Shift+C。您将在页面上看到鼠标后面的覆盖图。指向文本框并单击它
  • 单击开发工具左上角的“从页面中拾取元素”按钮,将显示相同的节点选择器

有关更多和深入的信息:请访问MDN页面:

谢谢……我只需要了解导致便便颜色突出的原因。