HTML DOM console.trace()用法及代碼示例

HTML DOM console.trace() 方法用於顯示調用 console.trace() 方法之前的堆棧跟蹤。它本質上用於顯示代碼路徑，即代碼在該點結束的方式。

用法

以下是 console.trace() 方法的語法。

console.trace(label);

這裏，label 是字符串類型的可選參數，用於指定代碼跟蹤的標簽。如果不同代碼段有多個跟蹤，這會有所幫助。

示例

讓我們看一個 console.trace() 方法的例子 -

<!DOCTYPE html>
<html>
<body>
<h1> console.trace() Method</h1>
<p>Click the below button…</p>
<button onclick="Function1()">Start Trace</button>
<script>
   function Function1(){
      Function2();
   }
   function Function2(){
      console.trace();
   }
</script>
<p>View the stack trace in the console after clicking the above button& </p>
</body>
</html>

輸出

這將產生以下輸出 -

單擊“開始跟蹤”按鈕並在控製台選項卡中查看輸出。

在上麵的例子中 -

我們首先創建了一個按鈕 “Start Trace”，它將在用戶單擊時執行 Function1()。

<button onclick="Function1()">Start Trace</button>

Function1() 將執行 Function2()，Function2() 將執行其中存在的 console.stacktrace() 方法。這是一個堆棧跟蹤，因此它將遵循 last-in first-out 順序。由於 console.trace 方法是由 Function2() 調用的，它將首先被彈出。

Function1() 執行了 Function2()，因此它將是第二個彈出。最後，由於 Function1() 在被點擊時由 “Start Trace” 按鈕執行，它將是最後一個彈出。這意味著這將是他們被調用的相反順序 -

<button onclick="Function1()">Start Trace</button>
function Function1(){
   Function2();
}
function Function2(){
   console.trace();
}

相關用法

注：本文由純淨天空篩選整理自AmitDiwan大神的英文原創作品 HTML DOM console.trace() Method。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。