我有一个镀铬扩展,它挂钩到devtools.理想情况下,我想要一个徽章,当点击它时,会打开我创建的新选项卡上的devtools.有没有办法从后台页面这样做?
从版本19开始,Chrome的Web Inspector具有称为"片段支持"的实验性功能.以下是如何激活它:
打开chrome:flags,启用"Developer Tools实验",重启.
打开Web Inspector(开发人员工具),点击右下角的设置齿轮图标,启用"Snippets support",重新启动.

打开Scripts面板,单击左侧的"导航树"图标,找到一个空的Snippets选项卡.

我的问题是:我可以用它做什么?我怎样才能用片段填充这个?
并非所有JavaScript文件都在Chorme Developer工具中可见.
谷歌浏览器是最新的.版本44.0.2403.130 m应用程序的调试版本.脚本在脑海中.
<script src="/Scripts/jquery-ui-1.8.24.js"></script>
<script src="/Scripts/jquery.validate.js"></script>
...
<script src="/Client/Statics/GuiContainers.js"></script>
<script src="/Client/ClientDAL.js"></script>
<script src="/Client/ClientLayoutUpdater.js"></script>
<script src="/Client/ClientRenderer.js"></script>
<script src="/Client/ControllerLocator.js"></script>
Run Code Online (Sandbox Code Playgroud)
脚本的第一部分在localhost/Scripts/*路径的Sources菜单下的Chrome Developer Tools中可见.自昨天以来,脚本的第二部分不可见.开发人员工具有什么问题?
JavaScript控制台中没有错误.我可以在网络选项卡中看到成功的JavaScript文件请求.所有JavaScript都已加载.应用程序正常.
开发人员工具有什么问题?有没有人有想法?
如果我将localhost"文件夹"添加到工作区,则一切都可见,甚至是服务器端源文件.
我的代码
<html>
<head>
<!-- Load TensorFlow.js -->
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs"></script>
<!-- Load Posenet -->
<script src="https://cdn.jsdelivr.net/npm/@tensorflow-models/posenet"></script>
</head>
<body>
<img id='cat' src='./pose/images/aa_085.jpg'/>
</body>
<!-- Place your code in the script tag below. You can also use an external .js file -->
<script>
var flipHorizontal = false;
var imageElement = document.getElementById('cat');
posenet.load().then(function(net) {
const pose = net.estimateSinglePose(imageElement, {
flipHorizontal: true
});
return pose;
}).then(function(pose){
console.log(pose);
})
</script>
</html>
Run Code Online (Sandbox Code Playgroud)
很少使用HTML和JS,几乎忘记了最基本的东西,有没有好心人指出我的傻瓜?附上错误信息。
DevTools 无法加载 SourceMap:无法加载https://cdn.jsdelivr.net/npm/@tensorflow/tf.min.js.map 的内容:HTTP 错误:状态码 404,net::ERR_HTTP_RESPONSE_CODE_FAILURE
几个星期前开始....在我们的一些网站上,但不是全部,在检查一个元素时,样式选项卡只显示"样式框",但不是与css相关的实际样式?-再次,这是只有在一些网站-怪异
它应该看起来像这样(右侧显示与css相关的样式)

但是 ......相反,在我们的一些网站上,这几周刚刚开始看起来像这样......在样式标签中没有显示css:

注意:它已经工作了2年 - 页面看起来很好,所有样式都应用于DOM,但在检查元素时不会显示在样式选项卡中.
有任何想法吗??
当我有DevTools开放,有一个小按钮切换Hide Drawer.和Show Console..除了名字不一致之外,"抽屉"对我来说非常烦人,因为它占用了大量的为devtools分配的小屏幕空间(我是底部停靠).如何让这个"抽屉"永久关闭?或者,如果我不能这样做,我至少可以保持它的高度尽可能低吗?(每次打开它都会返回默认高度)
我在网站上加载了约100-200个javascript函数.我想确定当我在Google Chrome中点击一个或另一个项目时执行的javascript功能.如何使用Chrome Web开发人员工具执行此操作?谢谢!
我使用谷歌Chrome开发人员工具,我不断检查一个元素来回反复来找出可能导致特定样式问题的因素.
比较元素1和元素2之间的风格差异会很好.
这可以通过Chrome目前或通过一些解决方法来完成吗?有没有可以做我想要的工具?
样式差异的当前示例是我在垂直对齐中出现较高H4的A位置旁边的内联A.我不会在这个问题上寻求解决方案,因为我会解决它.
css styles google-chrome google-chrome-extension google-chrome-devtools
有没有一种快速方法可以从Chrome DevTools中显示的jsx代码切换到原始ES5并再次返回?