2015-07-20 44 views
2

我想知道如何在Firefox中使用console.profile()。我已阅读以下材料http://getfirebug.com/wiki/index.php/Console.profile,我复制了代码并运行在我的Firefox中,但我没看到结果,为什么?为什么我在使用console.profile()时无法得到正确的答案?

function getById(id) 
    { 
     return document.getElementById(id); 
    } 

    function getViaSelector(id) 
    { 
     return document.querySelector(id); 
    } 

    var numberOfCalls = 10000; 

    console.profile("getElementById() vs. querySelector()"); 
    for (var i=0; i<numberOfCalls; ++i) 
     getById("test"); 
    for (var i=0; i<numberOfCalls; ++i) 
     getViaSelector("test"); 
    console.profileEnd(); 
+0

那么,在您的DOM中是否有ID测试元素? – Nit

+4

它应该是'document.querySelector('#'+ id)' – Satpal

+0

已经在我的dom ... – hanzichi

回答

1

如果页面包含ID为“test”的元素,则适用于我。如预期的那样,结果显示在内置Web控制台的运行时分析选项卡上。

注意,如果您使用Firebug,需要从Web服务器加载代码片段,因为Firebug不支持分析本地文件(注入的代码)。还请确保启用默认禁用的脚本调试。

下面是一个工作示例,您可以从文件或从本地Web服务器加载(在这两种情况下,分析工作对我而言)。

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Profiling Demo</title> 
    <script type="text/javascript"> 
     function getById(id) 
     { 
      return document.getElementById(id); 
     } 

     function getViaSelector(id) 
     { 
      return document.querySelector(id); 
     } 

     var numberOfCalls = 10000; 

     window.onload = function() { 
      console.profile("getElementById() vs. querySelector()"); 
      for (var i=0; i<numberOfCalls; ++i) { 
       getById("test"); 
      } 
      for (var i=0; i<numberOfCalls; ++i) { 
       getViaSelector("test"); 
      } 
      console.profileEnd(); 
     } 

    </script> 
</head> 
<body id="test"> 

</body> 
</html> 

结果显示在Firebug控制台中。不幸的是,由于我的声誉太低,我无法添加屏幕截图。

+0

这不提供问题的答案。要批评或要求作者澄清,在他们的帖子下留下评论 - 你总是可以评论你自己的帖子,一旦你有足够的[声誉](http://stackoverflow.com/help/whats-reputation),你会能够[评论任何帖子](http://stackoverflow.com/help/privileges/comment)。 –

+0

谢谢你的解释。由于缺乏足够的声誉,我不能评论问题!为此事道歉。 除此之外,我相信我已经回答了这个问题,即在Web控制台或Firebug中使用Firefox进行分析需要做些什么。 – Marcus

1

控制台没有数据,数据存储在“性能”选项卡下。

enter image description here

相关问题