วิธีเปิด Browser Console บน Chrome, Safari, Firefox และ Edge

สาเหตุที่พบบ่อยที่สุดที่ผู้ใช้ต้องการเปิดคอนโซลเบราว์เซอร์คือการระบุปัญหาเกี่ยวกับการแก้ไขหน้าองค์ประกอบอินเทอร์เฟซที่ใช้งานไม่ได้บล็อกการทำงานผิดปกติบล็อกโฆษณาข้อผิดพลาดและความขัดแย้งของ JavaScript ประเภทอื่น ๆ อย่างไรก็ตามเบราว์เซอร์แต่ละตัวมีทางลัดและขั้นตอนของตัวเองที่จะช่วยให้คุณเปิดคอนโซลและดูส่วนหลังของหน้าเว็บที่คุณเข้าชมได้ในที่สุด

วิธีเปิดคอนโซลบนเบราว์เซอร์เริ่มต้นของคุณ

เนื่องจากมีเบราว์เซอร์ที่แตกต่างกันเพียงสี่เบราว์เซอร์ที่มีส่วนแบ่งการตลาดมากกว่า 5% (Chrome, Safari, Edge และ Firefox) เราจะแสดงให้คุณเห็นหลายวิธีในการเปิดคอนโซลในแต่ละเบราว์เซอร์ แต่โปรดทราบว่าในแต่ละเบราว์เซอร์องค์ประกอบและข้อผิดพลาดโดยทั่วไปจะมีรหัสสีและมีป้ายกำกับต่างกัน

วิธีเปิดคอนโซลบน Google Chrome

ใน Chrome มีสามวิธีที่จะช่วยให้คุณเปิดคอนโซลในตัวได้

ไม่ว่าคุณจะใช้งาน Chrome บิวด์แบบใดคุณสามารถใช้ทางลัดต่อไปนี้เพื่อเปิดและปิดคอนโซลในตัว:

• F12
• Ctrl + Shift + J (Cmd + Option + J บน Mac)

โปรดทราบว่าสามารถใช้ทางลัดเดียวกันนี้เพื่อซ่อนคอนโซลได้ ตามค่าเริ่มต้นคอนโซลของ Google Chrome จะใช้เวลาครึ่งหนึ่งของหน้าจอ แต่คุณสามารถปรับอัตราส่วนได้อย่างง่ายดายผ่านแถบเลื่อนตรงกลางและเบราว์เซอร์จะจดจำการแก้ไขในครั้งต่อไปที่คุณเปิดคอนโซล

หากคุณต้องการเน้นองค์ประกอบเฉพาะคุณสามารถไฮไลต์ด้วยเมาส์ของคุณจากนั้นคลิกขวาที่องค์ประกอบ> ตรวจสอบ สิ่งนี้จะเปิดไฟล์ องค์ประกอบ แท็บและ รูปแบบ แท็บของคอนโซลช่วยให้คุณโฟกัสไปที่องค์ประกอบที่อยู่ในมือ

ตรวจสอบองค์ประกอบด้วยคอนโซลของ Google Chrome

อย่างไรก็ตามคุณสามารถเข้าถึงคอนโซลผ่านเมนู GUI ของ Google Chrome ในการดำเนินการนี้เพียงคลิกที่ปุ่มการกระทำที่มุมขวาบนและไปที่ เครื่องมือเพิ่มเติม> เครื่องมือสำหรับนักพัฒนา .

เครื่องมือสำหรับนักพัฒนา

หากคุณต้องการทำงานอย่างมีประสิทธิภาพที่สุดนี่คือรายการของ ทางลัดของ Chrome Console ที่คุณสามารถใช้ได้

วิธีเปิดคอนโซลบน Google Microsoft Edge

เช่นเดียวกับเบราว์เซอร์อื่น ๆ Microsoft Edge นอกจากนี้ยังมีเครื่องมือคอนโซลสำหรับนักพัฒนาที่ทำการตรวจแก้จุดบกพร่องแบบโต้ตอบหรือการทดสอบเฉพาะกิจ

เครื่องมือนี้บันทึกข้อมูลที่เกี่ยวข้องกับหน้าเว็บที่กำลังเข้าชม คุณจะพบข้อมูลที่เกี่ยวข้องกับ Javascript คำขอเครือข่ายและ ข้อผิดพลาดด้านความปลอดภัย .

วิธีง่ายๆในการเปิด Console Tool บน Microsoft Edge คือการใช้ทางลัดที่กำหนดไว้ล่วงหน้า ( คีย์ F12 ).

แต่คุณสามารถทำได้ผ่านเมนู GUI โดยคลิกที่ไฟล์ ปุ่มการดำเนินการ (มุมบนซ้าย)> เครื่องมือเพิ่มเติม> เครื่องมือสำหรับนักพัฒนา .

การเปิดเครื่องมือสำหรับนักพัฒนาบน Edge ผ่านเมนู GUI

และคล้ายกับการทำงานบนเบราว์เซอร์อื่น ๆ Microsoft Edge ยังช่วยให้คุณตรวจสอบองค์ประกอบเฉพาะโดยใช้คอนโซลในตัว ในการดำเนินการนี้เพียงแค่เลือกและคลิกขวาที่องค์ประกอบแล้วเลือก ตรวจสอบองค์ประกอบ.

การตรวจสอบองค์ประกอบบน Microsoft Edge

นี่คือรายการที่มีทางลัดที่มีประโยชน์ซึ่งคุณสามารถใช้ได้ภายในคอนโซลในตัวของ Microsoft Edge:

วิธีเปิดคอนโซลบน Mozilla Firefox

คอนโซลในตัวบน Mozilla Firefox ทำงานแตกต่างจากที่อื่น ๆ ที่เราวิเคราะห์ไว้เล็กน้อย สิ่งที่ฉันหมายถึงคือมันจะเปิดโดยอัตโนมัติในหน้าต่างแบบสแตนด์อโลนแทนที่จะแบ่งหน้าจอเบราว์เซอร์ของคุณเป็นครึ่งหนึ่ง

วิธีนี้ช่วยให้มีแนวทางการทำงานที่มีประสิทธิผลมากขึ้นสำหรับผู้ที่มีหน้าจอที่สอง แต่อาจขัดขวางผู้ใช้ที่ต้องทำงานกับหน้าจอขนาดเล็กเพียงหน้าจอเดียว (หากคุณอยู่ในสถานการณ์นี้คุณสามารถใช้ทางลัด Alt + Tab เพื่อสลับไปมาระหว่าง Firefox และ Browser Console ที่เกี่ยวข้อง

ในการเปิดคอนโซลเบราว์เซอร์ในตัวบน Mozilla Firefox คุณมีสามตัวเลือก:

• คุณสามารถใช้ทางลัดสากล - Ctrl + Shift + J (หรือ Cmd + Shift + J บน Mac)
• คุณสามารถเปิดได้จากเมนูการทำงาน - โดยคลิกที่เมนูการทำงาน> นักพัฒนาเว็บ> คอนโซลเบราว์เซอร์ .

การเข้าถึงคอนโซลของเบราว์เซอร์

• หรือคุณสามารถบังคับให้ Browser Console เปิดโดยตรงโดยเปิด Firefox จากบรรทัดคำสั่งแล้วส่งอาร์กิวเมนต์ '-jsconsole':

  /Applications/FirefoxAurora.app/Contents/MacOS/firefox-bin -jsconsole

บันทึก: Firefox ยังมีไฟล์ เว็บคอนโซล ซึ่งคล้ายกับคอนโซลของเบราว์เซอร์มาก แต่ใช้กับแท็บเนื้อหาเดียวแทนที่จะใช้กับเบราว์เซอร์ทั้งหมด

วิธีเปิดคอนโซลบน Google Safari

ซึ่งแตกต่างจากเบราว์เซอร์อื่น ๆ ที่เราดูจนถึงตอนนี้คอนโซลข้อผิดพลาดบน Safari จะปิดใช้งานโดยค่าเริ่มต้น ด้วยเหตุนี้คุณจะต้องทำขั้นตอนเพิ่มเติมเพื่อเปิดใช้งานบนเบราว์เซอร์ของคุณ

ในการดำเนินการนี้ให้เปิด Safari แล้วคลิกที่ไฟล์ ค่ากำหนด แท็บ เมื่อคุณอยู่ใน ค่ากำหนด คลิกที่แท็บขั้นสูงและเลือกช่องที่เกี่ยวข้องกับ แสดงพัฒนาการ เมนูในแถบเมนู

การเปิดใช้งานคอนโซลบน Safari

ตอนนี้คุณได้ทำให้คอนโซลมองเห็นได้แล้วคุณสามารถเปิดได้โดยเข้าไปที่ไฟล์ พัฒนา ที่ด้านบนและคลิกที่ แสดงคอนโซลข้อผิดพลาด .

แสดง Error Console บน Safari

โปรดทราบว่า Safari มีวิธีการแสดงคอนโซลข้อผิดพลาดแบบไดนามิก หากหน้าต่างมีขนาดเล็กเมื่อคุณเปิดคอนโซลคุณจะเห็นหน้าต่างที่แตกต่างไปจากเดิมอย่างสิ้นเชิง

ในกรณีที่คุณต้องการเปิดคอนโซลในหน้าต่างเดียวกับเพจของคุณคุณจะต้องตรวจสอบให้แน่ใจว่าหน้าต่างเบราว์เซอร์มีขนาดเต็มก่อนที่จะเปิดคอนโซลข้อผิดพลาด

การเปิด Error Console บน Safari