ความคิดเห็น: HTML5 ให้มาตรฐานสำหรับการแสดงวิดีโอ ดังนั้นจะตรวจสอบได้อย่างไรว่าเบราว์เซอร์ของคุณรองรับการเล่นวิดีโอหรือไม่? มาแบ่งปันตัวอย่างเล็ก ๆ น้อย ๆ กับคุณ เพื่อนที่สนใจสามารถเรียนรู้ได้
<strong> เว็บไซต์มากขึ้นเรื่อย ๆ เสนอการเล่นวิดีโอ (ไม่ใช่แบบพลักอิน) HTML5 ให้มาตรฐานสำหรับการนำเสนอวิดีโอ ดังนั้นจะตรวจสอบได้อย่างไรว่าเบราว์เซอร์ของคุณรองรับการเล่นวิดีโอหรือไม่? มาเขียนคอลัมน์ด้านล่าง </strong>
<! doctype html public "-// w3c // dtd xhtml 1.0 เข้มงวด // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd">>
<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<body>
<H1> วิดีโอ HTML 5 </h1>
<p> การตรวจจับว่าเบราว์เซอร์ของคุณรองรับวิดีโอ HTML5 หรือไม่: </p>
<div>
<button> ตรวจสอบ </button>
</div>
</div>
</body>
</html>
ต่อไปนี้คือรหัส JS:
ฟังก์ชั่น checkvideo ()
-
if (!! document.createElement ('วิดีโอ'). canplaytype)
-
// สร้างองค์ประกอบวิดีโอ
var vidTest = document.createElement ("วิดีโอ");
// การตรวจสอบว่าเป็นไปได้หรือไม่ที่จะเล่นวิดีโอในรูปแบบ OGG
oggtest = vidtest.canplaytype ('วิดีโอ/ogg; codecs = "Theora, vorbis"');
ถ้า (! Oggtest)
-
// ตรวจพบว่าวิดีโอรูปแบบ MP4 สามารถเล่นได้หรือไม่
h264test = vidTest.canplayType ('วิดีโอ/mp4; codecs = "avc1.42e01e, mp4a.40.2");
ถ้า (! H264Test)
-
document.getElementById ("CheckVideOresult"). innerhtml = "ขออภัยไม่มีการสนับสนุนวิดีโอ"
-
อื่น
-
ถ้า (H264Test == "อาจ")
-
document.getElementById ("CheckVideOsult"). innerHtml = "ใช่! สนับสนุนเต็ม!";
-
อื่น
-
document.getElementById ("CheckVideOresult"). innerHtml = "ดีการสนับสนุนบางอย่าง";
-
-
-
อื่น
-
ถ้า (Oggtest == "อาจ")
-
document.getElementById ("CheckVideOsult"). innerHtml = "ใช่! สนับสนุนเต็ม!";
-
อื่น
-
document.getElementById ("CheckVideOresult"). innerHtml = "ดีการสนับสนุนบางอย่าง";
-
-
-
อื่น
-
document.getElementById ("CheckVideOresult"). innerhtml = "ขออภัยไม่มีการสนับสนุนวิดีโอ"
-
-
คำอธิบายวิธี CanplayType:
1. คำจำกัดความ: ตรวจสอบว่าเบราว์เซอร์สามารถเล่นประเภทเสียง/วิดีโอที่ระบุได้หรือไม่
2. ค่าส่งคืน:
"อาจ" หมายความว่าเบราว์เซอร์มีแนวโน้มที่จะสนับสนุนวิดีโอหรือเสียงมากที่สุด
"บางที" หมายความว่าเบราว์เซอร์อาจรองรับวิดีโอหรือเสียง
"" (สตริงว่าง) หมายความว่าเบราว์เซอร์ไม่รองรับวิดีโอหรือเสียง
หมายเหตุ: Internet Explorer 8 และรุ่นก่อนหน้าไม่สนับสนุนวิธีนี้
ไวยากรณ์: เสียง | video.canplaytype (ประเภท))
คำอธิบายพารามิเตอร์:
พิมพ์: ประเภทของเสียงหรือวิดีโอที่จะตรวจพบ
ค่าที่ใช้กันทั่วไป: วิดีโอ/ogg; วิดีโอ/mp4; วิดีโอ/webm; เสียง/mpeg; เสียง/ogg; เสียง/mp4
ค่าทั่วไป (รวมถึงตัวแปลงสัญญาณเสียงหรือวิดีโอที่จะตรวจพบ):
วิดีโอ/ogg; codecs = "theora, vorbis"
วิดีโอ/mp4; codecs = "avc1.4d401e, mp4a.40.2"
วิดีโอ/webm; codecs = "vp8.0, vorbis"
เสียง/ogg; codecs = "vorbis"
เสียง/mp4; codecs = "mp4a.40.5"