标签: google-chrome-devtools

Chrome的开发工具或Firebug中是否存在"设置下一个语句"功能?

IE的开发工具,更具体地说是它的JavaScript调试器,提供了"Set next statement"命令,使您可以指定下一个应该执行的语句.这样,您可以有效地跳过函数的某些部分,甚至(再次,有效地)提前从函数返回.

所以,对于这个功能......

function test () {
    alert(1);
    alert(2);
    alert(3);
}
Run Code Online (Sandbox Code Playgroud)

如果我们在第一个警报上设置断点,然后调用该函数,我们可以执行第一个警报(F10),然后右键单击第三个警报并选择"设置下一个语句".现在,如果我们按F10,将执行第三个警报,因此,有效地,跳过了第二个警报.

(测试在IE 这里:---打开IE与F12工具,切换到"脚本"选项卡,设置断点,按"开始调试"按钮,必要时刷新页面)

我喜欢这个"set next statement"功能.但是,我没有在Chrome的开发工具或Firebug中注意到它.这些调试器中是否存在此功能?

javascript debugging firebug google-chrome-devtools

44
推荐指数
1
解决办法
7976
查看次数

谷歌浏览器显示灰色圆圈光标

当开发工具处于活动状态时,Google Chrome会显示灰色圆圈光标.为什么会发生这种情况?如何停止?

google-chrome google-chrome-devtools

44
推荐指数
4
解决办法
2万
查看次数

我如何从chrome开发人员工具下载/提取字体

我已经厌倦了很多东西,但即使我的电脑有它也无法得到它.

我如何访问这些文件...它们是.woff扩展名.在chrome检查器中双击它们只需要一些URL.哪个不起作用.

这个字体也没有安装在我的电脑上.

这实际上是我生命中第一次遇到woff格式和概念Web开放格式.我想下载字体网站正在使用.我知道我可以下载图像为什么不会.

在此输入图像描述

fonts google-chrome-devtools

44
推荐指数
5
解决办法
9万
查看次数

显示通过Chrome开发者工具进行的所有更改

如何显示使用Chrome Developer工具所做的所有更改?

例:

  1. 打开一个网站.
  2. 打开Chrome开发者工具.
  3. 更改标记的样式属性.
  4. 为某些css文件添加新样式.
  5. 更改JavaScript函数.

如何看待这些变化?就像是:

    page.html:56 Change style attribute of foo to bar.
    page.css:21 Lines added: 21,22,23,24.
    page.js:12 Line modified.
Run Code Online (Sandbox Code Playgroud)

css browser google-chrome google-chrome-devtools

44
推荐指数
3
解决办法
1万
查看次数

Chrome DevTools将所有HEX颜色转换为RGB

最近,Chrome DevTools已经开始将所有元素的HEX颜色转换为RGB值,无论是在CSS中设置HEX颜色还是通过DevTools本身设置.怎么阻止?

我知道按住Shift+单击将颜色转换为其他格式的颜色图标方法,但我觉得这很不方便.我想知道是否有人知道如何阻止这种情况发生?

css google-chrome css3 google-chrome-devtools

44
推荐指数
2
解决办法
1万
查看次数

Chrome DevTools不允许我在某些行上设置断点

在此输入图像描述

在上图中,我尝试在第437行到第443行的每一行设置断点.但是,我无法在第439行和第440行设置断点.当函数运行时,第437,438,441和442行上的断点将被忽略.Chrome在第443行中断.这意味着在第一次条件运行之前我无法进行一些调试.

当我点击第439或440行时,断点出现半秒并跳转到第443行.

这是一个错误还是我错过了什么?如何在439行或之前设置断点?

javascript google-chrome google-chrome-devtools

44
推荐指数
3
解决办法
1万
查看次数

如何阻止Chrome响应式检查器更改缩放?

- 在Chrome检查器中使用"切换设备滚动条"选项时,无论何时键入新的宽度/高度,窗口缩放都会自动调整宽度/高度.这是令人难以置信的令人沮丧的用户界面,因为我不希望变焦调整......永远.避免这种情况的唯一方法是通过拖动侧边框来调整响应窗口的大小.

有没有办法关闭自动变焦?

我当前的chrome版本:版本54.0.2840.98(64位)

google-chrome google-chrome-devtools

44
推荐指数
4
解决办法
2万
查看次数

Javascript使用谷歌浏览器逐行调试

如何使用Google Chromes开发人员工具逐行浏览我的javascript代码,而无需进入javascript库?

例如,我在我的网站上大量使用jQuery,我只想调试我编写的jQuery,而不是jquery库中的javascript/jquery.我如何只通过自己的jquery/javascript而不必遍历jquery库中的数百万行?

所以,如果我有以下内容:

function getTabFrame() {
    $.ajax({
        url: 'get_tab_frame.aspx?rand=' + Math.random(),
        type: 'GET',
        dataType: 'json',
        error: function(xhr, status, error) {
            //alert('Error: ' + status + '\nError Text: ' + error + '\nResponse Text: ' + xhr.responseText);
        },
        success: function(data) {
            $.each(data, function(index, item) {
                // do something here
            });
        }
    });
}
Run Code Online (Sandbox Code Playgroud)

如果我将断点放在$.ajax({,如果我开始调试它停止的地方,如果我然后按F11,它会直接进入jQuery库.我不希望这种情况发生,我希望它转到下一行url: 'get_tab_frame.aspx?rand=' + Math.random(),.

我尝试过按F10,但这直接关闭}了功能.F5只是进入下一个断点,而不是一个接一个地走过每一行.

javascript debugging jquery google-chrome google-chrome-devtools

43
推荐指数
2
解决办法
9万
查看次数

如何从JS Console中的console.timeEnd()获取输出?

我希望能够从console.timeEnd('t')我的Google Chrome Javascript控制台中获取返回的字符串.

在下面的这个例子中,我想要一个包含的变量 "t: 0.276ms"

> console.time('t'); console.timeEnd('t');
  t: 0.276ms
< undefined
Run Code Online (Sandbox Code Playgroud)

这是可行的吗?

javascript google-chrome google-chrome-devtools

43
推荐指数
3
解决办法
3万
查看次数

如何从chrome控制台访问角度的$ scope变量

如何从chrome的控制台访问范围变量小部件

function MyCntrl($scope) {
    $scope.widgets = [
        {text:'Widget #1', datarow:1, datacol:1, datasizex:3, datasizey:3},
        {text:'Widget #2', datarow:2, datacol:1, datasizex:3, datasizey:3},
        {text:'Widget #3', datarow:1, datacol:2, datasizex:3, datasizey:3},
        {text:'Widget #4', datarow:2, datacol:2, datasizex:3, datasizey:3}
    ];
Run Code Online (Sandbox Code Playgroud)

$scope.widgets简单的东西在控制台中不起作用!

google-chrome-devtools angularjs

43
推荐指数
3
解决办法
8万
查看次数