📜  HTML | DOM 视频 currentSrc 属性

📅  最后修改于: 2021-11-03 06:28:51             🧑  作者: Mango

Video currentSrc 属性用于返回当前视频的 URL 。如果没有指定视频, Video currentSrc 属性返回一个空字符串。
VideocurrentSrc 属性是只读属性。

句法:

videoObject.currentSrc

下面的程序说明了视频 currentSrc 属性:
示例:获取当前视频的 URL。



  

    
        HTML | DOM Video currentSrc Property
    <title>
    <style>
        h1 {
            color: green;
        }
          
        h2 {
            font-family: Impact;
        }
          
        body {
            text-align: center;
        }
    </style>
</head>
  
<body>
  
    <h1>GeeksforGeeks</h1>
    <h2>Video currentSrc Property</h2>
    <br>
  
    <video id="Test_Video" 
           width="360"
           height="240" 
           controls>
        <source src="samplevideo.mp4" 
                type="video/mp4">
        <source src="movie.ogg"
                type="video/ogg">
    </video>
  
    <p>
      To get the video URL, 
      double click the "Return URL" button.
    </p>
  
    <button ondblclick="My_Video()" 
            type="button">
      Return URL
    </button>
  
    <p id="test"></p>
  
    <script>
        function My_Video() {
            var v =
                document.getElementById(
              "Test_Video").currentSrc;
            document.getElementById("test").innerHTML = v;
        }
    </script>
  
</body>
  
</html>
</code></pre>
</div>
<p><strong>输出:</strong></p>
<ul>
<li>点击按钮前: <br/><img alt="" class="img-fluid" src="https://mangodoc.oss-cn-beijing.aliyuncs.com/geek8geeks/HTML_%7C_DOM_Video_currentSrc_Property_0.jpg"/></li>
<li>点击按钮后: <br/><img alt="" class="img-fluid" src="https://mangodoc.oss-cn-beijing.aliyuncs.com/geek8geeks/HTML_%7C_DOM_Video_currentSrc_Property_1.jpg"/></li>
</ul>
<p><strong>支持的浏览器:</strong> <em>HTML</em><strong>支持的浏览</strong>器<em>| DOM Video currentSrc 属性</em>如下:</p>
<ul>
<li>谷歌浏览器</li>
<li>IE浏览器</li>
<li>火狐</li>
<li>歌剧</li>
<li>苹果Safari </li>
</ul>
<div class="_ap_apex_ad" id="82d2079a-8120-480f-9fc7-5cda825d56e7" style="min-height:280px"></div>
<p></p></div>
</article>

                </div>

            </div>
        </div>
    </div>
</div>


  
<footer>
    <div class="bg-white text-center pb-1">
        <p class="text-body-tertiary pt-3 lh-lg text-opacity-50" id="footer-text">Copyright © 2020 - 2024 版权所有
            <br>

            <a href="https://beian.miit.gov.cn/" target="_blank"
                class="text-opacity-50 text-body-tertiary mt-1 mb-1">蜀ICP备20006366号-1</a>

            <br>
            Made with ❤️ in Chengdu
        </p>
    </div>
</footer>


  <!-- 引入Bootstrap JavaScript库 -->
  <script src="https://unpkg.com/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"
    crossorigin="anonymous"></script>

  <!-- 引入Meilisearch搜索相关的JavaScript库 -->
  <script
    src="https://cdn.jsdelivr.net/npm/@meilisearch/instant-meilisearch/dist/instant-meilisearch.umd.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/instantsearch.js@4"></script>
  <script src="https://imangodoc.com/static/javascript/meili_custom.js"></script>

  <!-- 引入prismjs代码高亮相关的JavaScript库 -->
  <script src="https://cdn.jsdelivr.net/npm/prismjs@1.29.0/components/prism-core.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/prismjs@1.29.0/plugins/toolbar/prism-toolbar.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/prismjs@1.29.0/plugins/autoloader/prism-autoloader.min.js"></script>
  <script
    src="https://cdn.jsdelivr.net/npm/prismjs@1.29.0/plugins/copy-to-clipboard/prism-copy-to-clipboard.min.js"></script>

</body>


</html>