ใช้เมธอด HTML DOM console.trace() เพื่อแสดงการติดตามสแต็กจนถึงจุดที่เมธอด console.trace() ถูกเรียกใช้ โดยพื้นฐานแล้วจะใช้เพื่อแสดงเส้นทางของรหัส เช่น โค้ดสิ้นสุด ณ จุดนั้นอย่างไร
ไวยากรณ์
ต่อไปนี้เป็นไวยากรณ์สำหรับเมธอด console.trace()
console.trace(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() ที่อยู่ภายใน มันเป็นการติดตามสแต็ก ดังนั้นมันจะเป็นไปตามลำดับเข้าก่อนออกก่อน เนื่องจากเมธอด console.trace ถูกเรียกใช้โดย Function2() จึงเป็นวิธีแรกที่จะเปิดขึ้นมา
Function1() ดำเนินการ Function2() ดังนั้นจึงเป็นครั้งที่สองที่จะถูกเปิด ในที่สุด เนื่องจาก Function1() ถูกเรียกใช้งานโดยปุ่ม "Start Trace" เมื่อถูกคลิกเข้าไปจะเป็นปุ่มสุดท้ายที่จะโผล่ขึ้นมา มันหมายความว่ามันจะเป็นลำดับที่กลับกันที่พวกเขาถูกเรียกร้อง -
<button onclick="Function1()">Start Trace</button>
function Function1(){
Function2();
}
function Function2(){
console.trace();
} 