วิธีการ ดู Source Code

ดาวน์โหลดบทความ
ร่วมเขียน โดย ทีมงานวิกิฮาว

ดาวน์โหลดบทความ

บทความวิกิฮาวนี้จะแนะนำวิธีการดู source code หรือภาษาเขียนโปรแกรมที่ใช้สร้างเว็บต่างๆ โดยใช้เบราว์เซอร์ทั่วไป ถ้าไม่ได้ใช้ Safari ก็จะดู source code ของเว็บในเบราว์เซอร์มือถือไม่ได้

วิธีการ 1
วิธีการ 1 ของ 3:

Chrome, Firefox, Edge และ Internet Explorer

ดาวน์โหลดบทความ
  1. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/a\/a4\/View-Source-Code-Step-1-Version-6.jpg\/v4-460px-View-Source-Code-Step-1-Version-6.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/a\/a4\/View-Source-Code-Step-1-Version-6.jpg\/v4-728px-View-Source-Code-Step-1-Version-6.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    ขั้นตอนการดู source code ใน Chrome, Firefox, Microsoft Edge และ Internet Explorer นั้นจะเหมือนกัน
  2. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/1\/11\/View-Source-Code-Step-2-Version-6.jpg\/v4-460px-View-Source-Code-Step-2-Version-6.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/1\/11\/View-Source-Code-Step-2-Version-6.jpg\/v4-728px-View-Source-Code-Step-2-Version-6.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    หรือก็คือเว็บที่จะดู source code
  3. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/6\/6f\/View-Source-Code-Step-3-Version-6.jpg\/v4-460px-View-Source-Code-Step-3-Version-6.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/6\/6f\/View-Source-Code-Step-3-Version-6.jpg\/v4-728px-View-Source-Code-Step-3-Version-6.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    ถ้าใช้ Mac แล้วเมาส์มีปุ่มเดียว ก็ให้กด Control ค้างไว้แล้วคลิกแทน ถ้าใช้แล็ปท็อปแบบมี trackpad ก็ให้คลิกหน้าเว็บโดยใช้ 2 นิ้วแทน แล้วเมนูจะขยายลงมา
    • ห้ามคลิกขวาที่ลิงค์หรือรูป ไม่งั้นเมนูที่โผล่มาจะไม่ใช่เมนูที่เราต้องการ
  4. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/4\/49\/View-Source-Code-Step-4-Version-6.jpg\/v4-460px-View-Source-Code-Step-4-Version-6.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/4\/49\/View-Source-Code-Step-4-Version-6.jpg\/v4-728px-View-Source-Code-Step-4-Version-6.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    เพื่อแสดง source code ของเบราว์เซอร์ในหน้าต่างใหม่ หรือท้ายหน้าต่างปัจจุบัน
    • จะเห็น View page source ถ้าใช้ Chrome และ Firefox และจะเห็น View Source ถ้าใช้ Microsoft Edge และ Internet Explorer
    • หรือกด Ctrl + U (PC) ไม่ก็ ⌥ Option + ⌘ Command + U (Mac) เพื่อแสดง source code
    โฆษณา
วิธีการ 2
วิธีการ 2 ของ 3:

Safari

ดาวน์โหลดบทความ
  1. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/3\/3d\/View-Source-Code-Step-5-Version-5.jpg\/v4-460px-View-Source-Code-Step-5-Version-5.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/3\/3d\/View-Source-Code-Step-5-Version-5.jpg\/v4-728px-View-Source-Code-Step-5-Version-5.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    ที่เป็นแอพสีฟ้ารูปเข็มทิศ
  2. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/5\/57\/View-Source-Code-Step-6-Version-5.jpg\/v4-460px-View-Source-Code-Step-6-Version-5.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/5\/57\/View-Source-Code-Step-6-Version-5.jpg\/v4-728px-View-Source-Code-Step-6-Version-5.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    ที่ด้านซ้ายบนของแถบเมนูใน Mac แล้วเมนูจะขยายลงมา
  3. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/8\/8a\/View-Source-Code-Step-7-Version-5.jpg\/v4-460px-View-Source-Code-Step-7-Version-5.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/8\/8a\/View-Source-Code-Step-7-Version-5.jpg\/v4-728px-View-Source-Code-Step-7-Version-5.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    ที่เป็นตัวเลือกกลางเมนูที่ขยายลงมา
  4. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/e\/ed\/View-Source-Code-Step-8-Version-5.jpg\/v4-460px-View-Source-Code-Step-8-Version-5.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/e\/ed\/View-Source-Code-Step-8-Version-5.jpg\/v4-728px-View-Source-Code-Step-8-Version-5.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    มุมขวาบนของหน้าต่าง Preferences
  5. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/f\/f3\/View-Source-Code-Step-9-Version-5.jpg\/v4-460px-View-Source-Code-Step-9-Version-5.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/f\/f3\/View-Source-Code-Step-9-Version-5.jpg\/v4-728px-View-Source-Code-Step-9-Version-5.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    ที่เป็นตัวเลือกทางด้านล่างของหน้าต่าง Preferences จะเห็นเมนู Develop โผล่มาในแถบเมนูของ Mac
  6. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/5\/50\/View-Source-Code-Step-10-Version-5.jpg\/v4-460px-View-Source-Code-Step-10-Version-5.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/5\/50\/View-Source-Code-Step-10-Version-5.jpg\/v4-728px-View-Source-Code-Step-10-Version-5.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    หรือก็คือเว็บที่จะดู source code
  7. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/e\/ec\/View-Source-Code-Step-11-Version-5.jpg\/v4-460px-View-Source-Code-Step-11-Version-5.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/e\/ec\/View-Source-Code-Step-11-Version-5.jpg\/v4-728px-View-Source-Code-Step-11-Version-5.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    ที่เป็นเมนูทางซ้ายของเมนู Window ในแถบเมนูของ Mac
  8. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/0\/0d\/View-Source-Code-Step-12-Version-5.jpg\/v4-460px-View-Source-Code-Step-12-Version-5.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/0\/0d\/View-Source-Code-Step-12-Version-5.jpg\/v4-728px-View-Source-Code-Step-12-Version-5.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    ทางด้านล่างของเมนูที่ขยายลงมา เพื่อให้ Safari แสดง source code ของหน้าเว็บนั้น
    • หรือกด ⌥ Option + ⌘ Command + U เพื่อแสดง source code ก็ได้
    โฆษณา
วิธีการ 3
วิธีการ 3 ของ 3:

เว็บตระกูล Wiki

ดาวน์โหลดบทความ
  1. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/8\/80\/View-Source-Code-Step-13-Version-4.jpg\/v4-460px-View-Source-Code-Step-13-Version-4.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/8\/80\/View-Source-Code-Step-13-Version-4.jpg\/v4-728px-View-Source-Code-Step-13-Version-4.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
  2. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/a\/aa\/View-Source-Code-Step-14-Version-5.jpg\/v4-460px-View-Source-Code-Step-14-Version-5.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/a\/aa\/View-Source-Code-Step-14-Version-5.jpg\/v4-728px-View-Source-Code-Step-14-Version-5.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
  3. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/e\/e1\/View-Source-Code-Step-15-Version-5.jpg\/v4-460px-View-Source-Code-Step-15-Version-5.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/e\/e1\/View-Source-Code-Step-15-Version-5.jpg\/v4-728px-View-Source-Code-Step-15-Version-5.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    เลื่อนไปตาม source แล้วเลือก/copy โค้ดที่จะ copy ไปใส่เว็บตัวเอง.
    โฆษณา

เคล็ดลับ

  • ปกติคุณจะดู source code ในเบราว์เซอร์มือถือไม่ได้ แต่เซฟ bookmark ของ Safari ใน iPhone หรือ iPad ได้ เพื่อดู source code ใน Safari เวอร์ชั่นมือถือ
โฆษณา

คำเตือน

  • อย่าไปเชื่อหรือดาวน์โหลดแอพ third-party ที่อ้างว่าแสดง source code ของเว็บได้
โฆษณา

บทความวิกิฮาวอื่น ๆ ที่่เกี่ยวข้อง

วิธีการ
ใช้ Print Screen (แคปหน้าจอ)
วิธีการ
สร้างไฟล์ Zip
วิธีการ
เปลี่ยนขนาด Artboard ของ Adobe Illustrator
วิธีการ
Crop รูปด้วยโปรแกรม Illustrator
วิธีการ
เพิ่มฟอนต์ใน Illustrator
วิธีการ
บีบอัดไฟล์ให้ขนาดเล็กลงมากด้วย 7zip
วิธีการ
ใส่ภาพพื้นหลังใน Word
วิธีการ
ปรับขนาดรูปเป็นหน่วย KB
วิธีการ
เพิ่มฟอนต์ใน Photoshop
วิธีการ
เปิดไฟล์ RAR
วิธีการ
ลบพื้นหลังรูปด้วย Adobe Illustrator
วิธีการ
พริ้นท์เอกสารหลายหน้าในกระดาษแผ่นเดียวด้วย Adobe Reader
วิธีการ
พิมพ์ตัวอักษรโค้งใน Photoshop
วิธีการ
กลับภาพ (Flip) ในโปรแกรม Adobe Photoshop
โฆษณา

เกี่ยวกับวิกิฮาวนี้

ในภาษาอื่น
มีการเข้าถึงหน้านี้ 46,503 ครั้ง

บทความนี้เป็นประโยชน์กับคุณไหม

โฆษณา