เมธอด HTML DOM console.groupCollapsed()

เมธอด HTML DOM console.groupCollapsed() ระบุจุดเริ่มต้นของกลุ่มข้อความที่ยุบรวม (collapsed)

ไวยากรณ์

ไวยากรณ์ดังนี้ -

console.groupCollapsed(label)

ที่นี่ label เป็นป้ายกำกับสำหรับกลุ่ม

ตัวอย่าง

ลองดูตัวอย่างสำหรับเมธอด console.groupCollapsed() -

<!DOCTYPE html> <html> <body> <h1>console.groupCollapsed() Method</h1> <p>กด F12 เพื่อดูข้อความในมุมมองคอนโซล</p> <button type="button" onclick="normMessage()">NORMAL</button> <button type="button" onclick="CollMessage()">COLLAPSED</button> <script> function normMessage(){ console.log("Hello world!"); } function CollMessage(){ console.groupCollapsed(); console.log("This message will be inside a collapsed group!"); console.log("This message will also be inside a collapsed group!"); } </script> </body> </html>

ผลลัพธ์

จะได้ผลลัพธ์ดังนี้ -

เมื่อคลิกปุ่ม NORMAL และดูมุมมองคอนโซลในตัวเลือกพัฒนา -

เมื่อคลิกปุ่ม COLLAPSED และดูมุมมองคอนโซลในตัวเลือกพัฒนา -

เมื่อคลิกปุ่ม COLLAPSED และดูมุมมองคอนโซลในตัวเลือกพัฒนา -

ในตัวอย่างข้างต้น -

เราสร้างปุ่มสองปุ่ม COLLAPSED และ GROUP ที่จะเรียกใช้ CollMessage() และ groupMessage() เมื่อถูกคลิกโดยผู้ใช้ -

<button type="button" onclick="normMessage()">NORMAL</button> <button type="button" onclick="CollMessage()">COLLAPSED</button>

เมธอด normMessage() มีเมธอด console.log() ที่รับสตริงหรืออ็อบเจกต์ที่จัดส่งเป็นพารามิเตอร์และเพียงแค่แสดงไปยังคอนโซล -

function normMessage(){ console.log("Hello world!"); }

เมธอด CollMessage() มีเมธอด console.groupCollapsed() ภายในที่ระบุว่าข้อความทั้งหมดที่เขียนหลังจุดนี้จะแสดงภายในกลุ่มข้อความที่ยุบรวม ข้อความตอนนี้ถูกยุบรวมภายในกลุ่มข้อความไม่เหมือนมุมมองขยายเริ่มต้นของเมธอด group() -

function CollMessage(){ console.groupCollapsed(); console.log("This message will be inside a collapsed group!"); console.log("This message will also be inside a collapsed group!"); }