Enable HTML5 Video Controls

Automatically adds the controls attribute to all HTML5 video elements

您需要先安裝使用者腳本管理器擴展,如 TampermonkeyGreasemonkeyViolentmonkey 之後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyUserscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 Tampermonkey,才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

(我已經安裝了使用者腳本管理器,讓我安裝!)

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

(我已經安裝了使用者樣式管理器,讓我安裝!)

// ==UserScript==
// @name         Enable HTML5 Video Controls
// @namespace    http://tampermonkey.net/
// @version      1.1
// @description  Automatically adds the controls attribute to all HTML5 video elements
// @author       YeXiu_AU
// @license      MIT
// @match        *://*/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // Function to add controls attribute to video elements
    function enableVideoControls() {
        var videos = document.querySelectorAll("video");
        videos.forEach(function(video) {
            video.setAttribute("controls", "true");
        });
    }

    // Add controls to existing video elements
    enableVideoControls();

    // Use MutationObserver to monitor for new video elements being added to the DOM
    var observer = new MutationObserver(function(mutations) {
        mutations.forEach(function(mutation) {
            if (mutation.addedNodes.length) {
                mutation.addedNodes.forEach(function(node) {
                    if (node.nodeName === "VIDEO") {
                        node.setAttribute("controls", "true");
                    } else if (node.querySelectorAll) {
                        var videos = node.querySelectorAll("video");
                        videos.forEach(function(video) {
                            video.setAttribute("controls", "true");
                        });
                    }
                });
            }
        });
    });

    // Start observing the document for changes
    observer.observe(document.body, { childList: true, subtree: true });

    // Ensure that controls are added when the DOM is ready
    document.addEventListener("DOMContentLoaded", enableVideoControls);
})();