Đa phương tiện (Multimedia) trong JavaScript



Đối tượng navigator trong JavaScript bao gồm một đối tượng con gọi là plugins. Đối tượng này là một mảng, với một cổng vào (entry) cho mỗi plug-in được cài đặt trên trình duyệt. Đối tượng navigator.plugins chỉ được hỗ trợ bởi Netscape, Firefox và Mozilla.

Ví dụ

Dưới đây là ví dụ minh họa cách liệt kê tất cả plug-in được cài đặt trên trình duyệt.

<html>
   
   <head>
      <title>List of Plug-Ins</title>
   </head>
   
   <body>
      <table border="1">
         <tr>
            <th>Plug-in Name</th>
            <th>Filename</th>
            <th>Description</th>
         </tr>
         
         <script language="JavaScript" type="text/javascript">
            for (i=0; i<navigator.plugins.length; i++) {
               document.write("<tr><td>");
               document.write(navigator.plugins[i].name);
               document.write("</td><td>");
               document.write(navigator.plugins[i].filename);
               document.write("</td><td>");
               document.write(navigator.plugins[i].description);
               document.write("</td></tr>");
            }
         </script>
         
      </table>
      
   </body>
</html>
Quảng cáo

Kết quả

Kiểm tra cho Plug-Ins

Mỗi plug-in có một cổng vào trong mảng đó. Mỗi cổng vào có các thuộc tính sau:

  • name − Là tên của plug-in.

  • filename − Là file thực thi mà được tải để cài đặt plug-in.

  • Miêu tả − Là miêu tả của plug-in, được cung cấp bởi nhà lập trình.

  • mimeTypes − Là một mảng với một cổng vào cho mỗi kiểu MIME được hỗ trợ bởi plug-in đó.

Bạn có thể sử dụng các thuộc tính này trong một script để tìm các plug-ins đã được cài đặt, và sau đó sử dụng JavaScript, bạn có thể chơi các file đa phương tiện thích hợp. Bạn quan sát ví dụ sau:

<html>
   
   <head>
      <title>Using Plug-Ins</title>
   </head>
   
   <body>
   
      <script language="JavaScript" type="text/javascript">
         media = navigator.mimeTypes["video/quicktime"];
         
         if (media){
            document.write("<embed src='quick.mov' height=100 width=100>");
         }
         else
         {
            document.write("<img src='quick.gif' height=100 width=100>");
         }
      </script>
      
   </body>
</html>

Kết quả

Ghi chú − Ở đây chúng tôi đang sử dụng thẻ HTML <embed> để nhúng file đa phương tiện.

Quảng cáo

Điều khiển đa phương tiện

Chúng ra cùng thực hiện một ví dụ thực sự mà làm việc trong hầu hết các trình duyệt:

<html>
   
   <head>
      <title>Using Embeded Object</title>
      
      <script type="text/javascript">
         <!--
            function play()
            {
               if (!document.demo.IsPlaying()){
                  document.demo.Play();
               }
            }
            function stop()
            {
               if (document.demo.IsPlaying()){
                  document.demo.StopPlay();
               }
            }
            function rewind()
            {
               if (document.demo.IsPlaying()){
                  document.demo.StopPlay();
               }
               document.demo.Rewind();
            }
         //-->
      </script>
      
   </head>
   
   <body>
      
      <embed id="demo" name="demo"
      src="http://www.amrood.com/games/kumite.swf"
      width="318" height="300" play="false" loop="false"
      pluginspage="http://www.macromedia.com/go/getflashplayer"
      swliveconnect="true">
      </embed>
      
      <form name="form" id="form" action="#" method="get">
         <input type="button" value="Start" onclick="play();" />
         <input type="button" value="Stop" onclick="stop();" />
         <input type="button" value="Rewind" onclick="rewind();" />
      </form>
      
   </body>
</html>

Kết quả

Nếu bạn đang sử dụng Mozilla, Firefox hoặc Netscape, thì khi đó:

Đã có app VietJack trên điện thoại, giải bài tập SGK, SBT Soạn văn, Văn mẫu, Thi online, Bài giảng....miễn phí. Tải ngay ứng dụng trên Android và iOS.

Theo dõi chúng tôi miễn phí trên mạng xã hội facebook và youtube:

Các bạn có thể mua thêm khóa học JAVA CORE ONLINE VÀ ỨNG DỤNG cực hay, giúp các bạn vượt qua các dự án trên trường và đi thực tập Java. Khóa học có giá chỉ 300K, nhằm ưu đãi, tạo điều kiện cho sinh viên cho thể mua khóa học.

Nội dung khóa học gồm 16 chuơng và 100 video cực hay, học trực tiếp tại https://www.udemy.com/tu-tin-di-lam-voi-kien-thuc-ve-java-core-toan-tap/ Bạn nào có nhu cầu mua, inbox trực tiếp a Tuyền, cựu sinh viên Bách Khoa K53, fb: https://www.facebook.com/tuyen.vietjack

Follow facebook cá nhân Nguyễn Thanh Tuyền https://www.facebook.com/tuyen.vietjack để tiếp tục theo dõi các loạt bài mới nhất về Java,C,C++,Javascript,HTML,Python,Database,Mobile.... mới nhất của chúng tôi.

Các bài học JavaScript khác tại VietJack:




Tài liệu giáo viên