Phương thức HTML DOM console.trace() được dùng để hiển thị stack trace (ngăn xếp gọi) đến điểm phương thức console.trace() đã được gọi. Nó về cơ bản được dùng để hiển thị đường dẫn mã, tức là cách mã kết thúc tại điểm đó.
Cú pháp
Cú pháp sau đây dùng cho phương thức console.trace().
console.trace(label);
Ở đây, label là tham số tùy chọn kiểu chuỗi để chỉ định nhãn cho dấu vết mã. Điều này giúp nếu có nhiều dấu vết cho các phần mã khác nhau.
Ví dụ
Hãy xem một ví dụ cho phương thức console.trace():
<!DOCTYPE html> <html> <body> <h1>Phương thức console.trace()</h1> <p>Nhấn nút bên dưới...</p> <button onclick="Function1()">BẮT ĐẦU TRACE</button> <script> function Function1(){ Function2(); } function Function2(){ console.trace(); } </script> <p>Xem stack trace trong console sau khi nhấn nút trên</p> </body> </html>Kết quả
Điều này sẽ tạo ra kết quả sau:
Khi nhấn nút BẮT ĐẦU TRACE và xem kết quả trong tab console:
Trong ví dụ trên:
Chúng ta đã tạo nút "BẮT ĐẦU TRACE" sẽ thực thi Function1() khi được nhấp bởi người dùng.
<button onclick="Function1()">BẮT ĐẦU TRACE</button>
Function1() sẽ thực thi Function2() và Function2() sẽ thực thi phương thức console.trace() bên trong nó. Đây là một stack trace nên nó sẽ tuân theo trình tự last-in first-out (vào sau ra trước). Vì phương thức console.trace được gọi bởi Function2(), nó sẽ là cái đầu tiên bị pop.
Function1() đã thực thi Function2(), nên nó sẽ là cái thứ hai bị pop. Cuối cùng, vì Function1() được thực thi bởi nút "BẮT ĐẦU TRACE" khi được nhấp, nó sẽ là cái cuối cùng bị pop. Nghĩa là nó sẽ theo thứ tự ngược lại của thứ tự chúng được gọi:
<button onclick="Function1()">BẮT ĐẦU TRACE</button> function Function1(){ Function2(); } function Function2(){ console.trace(); }