วิธีเปิดใช้งาน Web Inspector บน iPhone ของคุณ

คำแนะนำสั้น ๆ สำหรับการตรวจสอบพฤติกรรมของเว็บไซต์บนมือถือ

การดาวน์โหลด

• เปิดใช้งาน Web Inspector บน iOS: การตั้งค่า > แอป > Safari > ขั้นสูง > Web Inspector.
• ใช้ Web Inspector บน Mac: เชื่อมต่ออุปกรณ์ของคุณและเลือก URL ที่ต้องการตรวจสอบจากเมนู Develop ของ Safari

ถ้าคุณเจอบั๊กหรือปัญหาอื่น ๆ กับเว็บไซต์บน Safari ใช้เครื่องมือ Web Inspector เพื่อตรวจสอบ บทความนี้อธิบายวิธีเปิดฟีเจอร์นี้จากโทรศัพท์ของคุณเพื่อแก้ไขข้อผิดพลาดด้วยความช่วยเหลือจาก Mac ของคุณ

วิธีเปิดใช้งาน Web Inspector บน iPhone

เครื่องมือตรวจสอบเว็บถูกปิดใช้งานโดยค่าเริ่มต้นเนื่องจากผู้ใช้ iPhone ส่วนใหญ่ไม่มีความจำเป็นต้องใช้ อย่างไรก็ตาม หากคุณเป็นนักพัฒนาหรือคุณสนใจ คุณสามารถเปิดใช้งานได้ในไม่กี่ขั้นตอน นี่คือวิธี:

1. เปิดแอป การตั้งค่า ของโทรศัพท์ของคุณ

   บน iPhone ที่ใช้เวอร์ชัน iOS รุ่นแรก ให้เข้าถึงคอนโซลดีบักผ่าน การตั้งค่า > Safari > นักพัฒนา > คอนโซลดีบัก เมื่อ Safari ตรวจพบข้อผิดพลาดของ CSS, HTML และ JavaScript รายละเอียดของแต่ละข้อผิดพลาดจะแสดงในดีบักเกอร์

2. เลื่อนลงด้านล่างแล้วแตะ แอป > Safari

3. เลือก ขั้นสูง ที่ด้านล่างสุดของหน้าดังกล่าว

4. เลื่อนสวิตช์สลับ Web Inspector ไปที่ตำแหน่ง เปิด

   

5. เปิด Safari ไปยังหน้าเว็บที่คุณจะตรวจสอบ

เชื่อมต่อ iPhone ของคุณกับ Safari บน Mac

ในการใช้ Web Inspector ให้เชื่อมต่ออุปกรณ์ของคุณกับ Mac และเปิดใช้งานเมนู Develop ใน Safari

1. เมื่อเปิด Safari แล้ว ให้เลือก Safari จากแถบเมนูและเลือก การตั้งค่า

   

2. เลือกแท็บ ขั้นสูง

3. เลือกช่องที่ด้านล่างของหน้าต่าง ถัดจาก แสดงคุณสมบัติสำหรับนักพัฒนาเว็บ หากคุณไม่เห็น ให้มองหา แสดงเมนูพัฒนาในแถบเมนู

   

4. เลือก Develop จากแถบเมนู Safari

5. เลื่อนเมาส์ไปที่ ชื่ออุปกรณ์ของคุณ จากนั้นเลือก URL ที่ปรากฏภายใต้ Safari เพื่อเปิดคอนโซลดีบักสำหรับเว็บไซต์ที่เปิดอยู่บนโทรศัพท์ของคุณ

   

6. ตัวตรวจสอบเว็บจะเปิดขึ้น

   

Web Inspector คืออะไร?

นักพัฒนาเว็บใช้ Web Inspector เพื่อแก้ไข ดีบัก และปรับแต่งเว็บไซต์บน Mac และอุปกรณ์ iOS เมื่อตัว Web Inspector เปิดอยู่ นักพัฒนาสามารถตรวจสอบทรัพยากรบนหน้าเว็บ หน้าต่าง Web Inspector มี HTML ที่สามารถแก้ไขได้และบันทึกเกี่ยวกับสไตล์และเลเยอร์ของหน้าเว็บในแผงแยกต่างหาก

ด้วย Safari 9 และ OS X Mavericks (10.9) Apple ได้นำเสนอโหมดการออกแบบตอบสนองใน Web Inspector นักพัฒนาจะใช้ตัวจำลองในตัวนี้เพื่อดูตัวอย่างว่าเว็บเพจปรับขนาดอย่างไรกับขนาดหน้าจอ ความละเอียด และทิศทางที่ต่างกัน

ก่อน iOS 6 เบราว์เซอร์เว็บ Safari บน iPhone มีคอนโซลดีบักในตัวที่นักพัฒนาใช้ค้นหาข้อบกพร่องของเว็บเพจ เวอร์ชันล่าสุดของ iOS ใช้ Web Inspector แทน

คำถามที่พบบ่อย

ฉันจะใช้ Web Inspector บน iPad ของฉันได้อย่างไร?

ในการตั้งค่า Web Inspector บน iPad ของคุณ ให้เปิดการตั้งค่าของ iPad และเลือก Safari > ขั้นสูง จากนั้นเปิด Web Inspector เปิด เชื่อมต่อ iPad กับคอมพิวเตอร์ Mac จากนั้นเปิด Safari บน Mac และเลือก Safari > การตั้งค่า > ขั้นสูง จากนั้นเปิด แสดงเมนูพัฒนาในแถบเมนู

ฉันสามารถใช้ Web Inspector บน iOS กับ Chrome บน Windows ได้ไหม?

คุณไม่สามารถเพียงแค่เชื่อมต่อ iPhone ของคุณกับคอมพิวเตอร์ Windows แล้วเริ่มใช้ Web Inspector ผ่าน Chrome ได้เหมือนกับที่คุณทำบน Mac การติดตั้งซอฟต์แวร์ตัวจัดการแพ็กเกจสามารถให้วิธีแก้ปัญหาประเภทหนึ่งแก่คุณ แต่ไม่แนะนำเว้นแต่คุณจะคุ้นเคยกับแอปจัดการแพ็กเกจที่คุณตั้งใจจะใช้