欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

视频倍速播放

程序员文章站 2024-03-23 20:18:40
...

百度网盘视频加速

由于非VIP,页面不提供视频加速播放功能

videojs.getPlayers("video-player").html5player.tech_.

视频倍速播放

video控件控制

document.getElementsByTagName("video")[0].playbackRate=1; # 适用于bilibili(支持16倍速) 腾讯视频

视频倍速播放

腾讯视频

也可以通过获取video对象操作,通常各个厂商会进行封装提供更简便的调用(player, video…)

PLAYER.setPlaybackRate(1.5) 

视频倍速播放


shadow-dom下无法获取video控件

参考:谈一谈神奇的ShadowDOM-ShadowRoot神秘的 shadow-dom 浅析,shadow-rootHTML5全屏模式下隐藏默认视频控制栏Hiding Native HTML5 Video Controls in Full-Screen Mode

ShadowDOM主要解决一个文档中可能需要大量交互的多个DOM树建立和维护各自功能边界的问题

ShadowDOM的意义及用法

The Shadow DOM encapsulates content by creating document fragments. Effectively, the content of a Shadow DOM is a different document, which is merged with the main document to create the overall rendered output.

In fact some browsers already use this to render some of their native widgets.

示例

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>shadowDOM</title>
    <style type="text/css">
        #mydiv { width: 300px;height: 50px;border: 1px solid #666;padding: 15px; }
    </style>
</head>
<body>
    <div id="mydiv">这里是不显示出来的,如果你看到了,说明浏览器不支持ShadowDOM</div>
    <button>点我点我</button>
    <script type="text/javascript">
        function createShadowDOM(elem) {
			//mode 模式
			//指定 Shadow DOM 树封装模式的字符串,可以是以下值:
			//open shadow root元素可以从js外部访问根节点,例如使用 Element.shadowRoot:
			//element.shadowRoot; // 返回一个ShadowRoot对象
			//closed 拒绝从js外部访问关闭的shadow root节点
			//element.shadowRoot; // 返回null
            var root = elem.attachShadow({mode: 'open'});  // mode: open 可以从外部访问; closed不可访问
            root.appendChild(createStyle());
            root.appendChild(createInputDiv("姓名","name"));
        }
        function createStyle() {
            var style = document.createElement('style');
            style.textContent = 'div.input-div { height: 30px; width: 250px; }' +
            'font.input-font { line-height: 30px;font-size: 16px;color: #495A80; margin-right: 10px;}'+
            'span.input-area {width: 200px;height: 25px;line-height: 25px;padding-left: 5px;display:inline-block;color: #666;font-size: 16px;border: 1px solid #999;border-radius: 3px;}';
            return style;
        }
        function createInputDiv(font, name) {
            var inputDiv = document.createElement('div');
            inputDiv.className = 'input-div';
            inputDiv.innerHTML = "<font class='input-font'>" + font + "</font><span class='input-area' contentEditable='true' id=" + name + "></span>";
            return inputDiv;
        }
        createShadowDOM(document.querySelector("#mydiv"));
        //此处通过element.shadowRoot进行访问内部元素
        document.querySelector('button').addEventListener('click', function() {            alert(document.querySelector('#mydiv').shadowRoot.querySelector('#name').innerHTML);
        }) 
    </script>
</body>
</html>

百度网盘视频播放

视频倍速播放

百度网盘指定了 mode:closed,无法从外部获取video标签

相关标签: web 兴趣