将沉浸式翻译的 Youtube 字幕导出,但不必注册付费为 Pro

直接让 Chatgpt 写一个油猴插件,将字幕展示区的字符串拼接起来,然后在视频播放完后,直接点击右下角浮动按钮,让其展示文本框,然后复制粘贴走。

// ==UserScript==
// @name         油猴创建导出字幕按钮并弹出浮动层(显示字幕可复制)
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  在 YouTube 页面右下角创建一个浮动按钮,点击后弹出一个浮动层,显示英文字幕和中文字幕,并允许复制
// @match        *://www.youtube.com/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    let sourceSubtitles = []; // 存储英文字幕(源语言)
    let targetSubtitles = []; // 存储中文字幕(翻译后字幕)

    // 创建浮动层
    function createFloatingLayer() {
        const overlay = document.createElement('div');
        overlay.style.position = 'fixed';
        overlay.style.top = '0';
        overlay.style.left = '0';
        overlay.style.width = '100vw';
        overlay.style.height = '100vh';
        overlay.style.backgroundColor = 'rgba(0, 0, 0, 0.7)';
        overlay.style.display = 'flex';
        overlay.style.alignItems = 'center';
        overlay.style.justifyContent = 'center';
        overlay.style.zIndex = '9999';
        overlay.style.display = 'none'; // 初始隐藏

        // 创建弹窗内容容器
        const container = document.createElement('div');
        container.style.backgroundColor = '#fff';
        container.style.padding = '20px';
        container.style.borderRadius = '8px';
        container.style.width = '80%';
        container.style.maxWidth = '900px';
        container.style.textAlign = 'center';

        // 创建英文字幕文本框
        const sourceTextarea = document.createElement('textarea');
        sourceTextarea.value = sourceSubtitles.join('\n');
        sourceTextarea.style.width = '100%';
        sourceTextarea.style.height = '200px';
        sourceTextarea.style.marginBottom = '10px';
        sourceTextarea.style.resize = 'none';
        sourceTextarea.setAttribute('readonly', 'true'); // 设置为只读,防止修改

        // 创建中文字幕文本框
        const targetTextarea = document.createElement('textarea');
        targetTextarea.value = targetSubtitles.join('\n');
        targetTextarea.style.width = '100%';
        targetTextarea.style.height = '200px';
        targetTextarea.style.marginBottom = '10px';
        targetTextarea.style.resize = 'none';
        targetTextarea.setAttribute('readonly', 'true'); // 设置为只读,防止修改

        // 关闭按钮
        const closeButton = document.createElement('button');
        closeButton.textContent = '关闭';
        closeButton.style.backgroundColor = '#FF0000';
        closeButton.style.color = '#fff';
        closeButton.style.border = 'none';
        closeButton.style.padding = '10px 15px';
        closeButton.style.fontSize = '16px';
        closeButton.style.cursor = 'pointer';
        closeButton.style.borderRadius = '5px';
        closeButton.addEventListener('click', () => {
            overlay.style.display = 'none'; // 点击关闭按钮后隐藏弹窗
        });

        // 将所有内容添加到容器
        container.appendChild(sourceTextarea);
        container.appendChild(targetTextarea);
        container.appendChild(closeButton);

        // 将容器添加到浮动层
        overlay.appendChild(container);

        // 将浮动层添加到页面
        document.body.appendChild(overlay);

        // 显示浮动层
        overlay.style.display = 'flex';
    }

    // 定时检查字幕并累积
    function checkSubtitles() {
        const captionWindow = document.querySelector('#immersive-translate-caption-window');

        if (captionWindow && captionWindow.shadowRoot) {
            const shadowRoot = captionWindow.shadowRoot;
            const sourceText = shadowRoot.querySelector('.source-cue')?.textContent?.trim();
            const translatedText = shadowRoot.querySelector('.target-cue')?.textContent?.trim();

            // 处理英文字幕
            if (sourceText && !sourceSubtitles.includes(sourceText)) {
                sourceSubtitles.push(sourceText); // 累积英文字幕
                console.log('✅ 新英文字幕:', sourceText); // 输出新的英文字幕
            }

            // 处理中文字幕
            if (translatedText && !targetSubtitles.includes(translatedText)) {
                targetSubtitles.push(translatedText); // 累积中文字幕
                console.log('✅ 新中文字幕:', translatedText); // 输出新的中文字幕
            }
        }
    }

    // 创建浮动按钮
    function createFloatingButton() {
        const button = document.createElement('button');
        button.textContent = '显示字幕';
        button.style.position = 'fixed';
        button.style.bottom = '20px';
        button.style.right = '20px';
        button.style.padding = '10px 15px';
        button.style.backgroundColor = '#FF0000';
        button.style.color = '#fff';
        button.style.border = 'none';
        button.style.fontSize = '16px';
        button.style.cursor = 'pointer';
        button.style.borderRadius = '5px';
        button.style.zIndex = '9999';

        // 设置点击按钮的行为,弹出字幕浮动层
        button.addEventListener('click', () => {
            createFloatingLayer();
        });

        // 将按钮添加到页面
        document.body.appendChild(button);
        console.log('✅ 浮动导出字幕按钮已创建');
    }

    // 页面加载完成后创建浮动按钮
    const interval = setInterval(() => {
        const menu = document.querySelector('#menu');
        if (menu) {
            createFloatingButton(); // 创建按钮
            clearInterval(interval); // 终止定时器
            console.log('✅ 页面元素加载完成,浮动按钮已创建');
        }
    }, 1000); // 每隔1秒检查一次

    // 每隔1秒检查字幕并累积
    setInterval(checkSubtitles, 1000);

})();
暂无评论

发送评论 编辑评论


				
|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
上一篇
下一篇