我试图检查CSS属性从输入到表格单元格。输入在点击时出现,在失去焦点时消失,就像我试图检查它一样。 当我移动到另一个窗口(检查器)时,我如何做到不失去焦点?


当前回答

在Chrome的开发人员工具页面上测试的页面…点击选项菜单,打开设置选项…在DevTools下启用“模拟焦点页面”

然后在测试页面中显示元素。这可以让我的弹出式搜索结果集中在屏幕上,这样我就可以使用它。

其他回答

不确定这是否在你的情况下工作,但通常(在任何情况下都值得一提,因为这是一个伟大的工具)在Chrome开发工具中,你可以模拟元素的状态,其中一个也是:焦点。

要做到这一点,请转到开发人员工具中的元素选项卡,并确保您在右侧的样式部分(这应该是启动开发人员工具时的默认位置)。现在在右上角的样式下面有一个Toggle Element State图标。当你点击它时,你可以模拟:active,:hover,:focus和:visited在你的代码视图中选择左边的元素。

在Chrome浏览器中,打开开发人员工具,然后选择元素选项卡 打开你想要检查的元素的父节点的上下文菜单,在上下文菜单中单击>子树修改上的Break。

之后,你只需要点击页面,你就会进入检查器,而不会失去焦点或失去你想要检查的元素。

在chrome devtools中单击元素的右侧;-)

将以下Javascript代码粘贴到浏览器开发控制台:

// Delayed console log of parent element with disappearing child element(s)
// Once code is trigger, you have 3 seconds to trigger the hidden element before it snapshots.
// The hidden elements should appear in the console ready to inspect.

var timer = 3000; //time before snapshot
var parent_of_element_to_inspect = 'div.elementcontainer'; //container of element to snapshot
setTimeout(function(){
 console.log(document.querySelector(parent_of_element_to_inspect).cloneNode(true));
},timer);

不是一个真正的解决方案,但它通常是有效的。

聚焦元素 右击上下文菜单 转到开发人员工具