2015-07-20 83 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

相關問題