网页脚本 bilibili007:评论下载脚本

效果

在这里插入图片描述
在这里插入图片描述

  • 下载效果(将不同的评论换行输出):
    在这里插入图片描述

实现代码

// ==UserScript==
// @name         下载按钮脚本
// @namespace    http://your-namespace.example.com
// @version      0.1
// @description  为每个<span>元素创建下载按钮,并点击后弹出相关信息
// @author       Your Name
// @match        https://www.bilibili.com/video/*
// @grant        none
// ==/UserScript==

var mytext = [];
let myButton = document.createElement('button');
var theurl = "123";//  window.prompt() - 输入框://无用的参数,
function sleep(ms) {
  return new Promise(resolve => setTimeout(resolve, ms));
}

async function downloadfun(subtitleInfo,thename) {
  console.log("myshowTranscript", subtitleInfo);
    var blob = new Blob(mytext, { type: 'text/plain' });
    var link = document.createElement('a');
    link.href = URL.createObjectURL(blob);
    link.download = thename+ '.txt';
    document.body.appendChild(link);
    link.click();// Trigger a click event on the link to initiate the download
    document.body.removeChild(link);
}

function getVideoName(){
    var download = "default";
    return new Promise((resolve, reject) => {
         if(document.querySelector('.video-title') == null){
             download = Date.now();
             alert("无法获取视频名称,请下载文件后手动更改名称!!!");
         }else{
             download = document.querySelector('.video-title').textContent;
         }
        resolve(download+"——评论");
    });
}

function addDownloadButton(theurl, thename){

    myButton.textContent = 'Click me';
    myButton.classList.add("download");
    myButton.style = 'font-size: 26px; position: fixed; top: 100px; left: 0; z-index: 9999; list-style: none; border: 1px red solid; border-radius: 10px;background-color: #00ccff; padding:5px';
    myButton.innerHTML ='<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg" class="zhuzhan-icon"><path fill-rule="evenodd" clip-rule="evenodd" d="M3.73252 2.67094C3.33229 2.28484 3.33229 1.64373 3.73252 1.25764C4.11291 0.890684 4.71552 0.890684 5.09591 1.25764L7.21723 3.30403C7.27749 3.36218 7.32869 3.4261 7.37081 3.49407H10.5789C10.6211 3.4261 10.6723 3.36218 10.7325 3.30403L12.8538 1.25764C13.2342 0.890684 13.8368 0.890684 14.2172 1.25764C14.6175 1.64373 14.6175 2.28484 14.2172 2.67094L13.364 3.49407H14C16.2091 3.49407 18 5.28493 18 7.49407V12.9996C18 15.2087 16.2091 16.9996 14 16.9996H4C1.79086 16.9996 0 15.2087 0 12.9996V7.49406C0 5.28492 1.79086 3.49407 4 3.49407H4.58579L3.73252 2.67094ZM4 5.42343C2.89543 5.42343 2 6.31886 2 7.42343V13.0702C2 14.1748 2.89543 15.0702 4 15.0702H14C15.1046 15.0702 16 14.1748 16 13.0702V7.42343C16 6.31886 15.1046 5.42343 14 5.42343H4ZM5 9.31747C5 8.76519 5.44772 8.31747 6 8.31747C6.55228 8.31747 7 8.76519 7 9.31747V10.2115C7 10.7638 6.55228 11.2115 6 11.2115C5.44772 11.2115 5 10.7638 5 10.2115V9.31747ZM12 8.31747C11.4477 8.31747 11 8.76519 11 9.31747V10.2115C11 10.7638 11.4477 11.2115 12 11.2115C12.5523 11.2115 13 10.7638 13 10.2115V9.31747C13 8.76519 12.5523 8.31747 12 8.31747Z" fill="currentColor"></path></svg>'
    myButton.addEventListener("mouseover", function() {
        myButton.innerHTML ="DOWN LOAD DISSCUSS";
    });

    myButton.addEventListener("mouseout", function() {
        myButton.innerHTML ='<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg" class="zhuzhan-icon"><path fill-rule="evenodd" clip-rule="evenodd" d="M3.73252 2.67094C3.33229 2.28484 3.33229 1.64373 3.73252 1.25764C4.11291 0.890684 4.71552 0.890684 5.09591 1.25764L7.21723 3.30403C7.27749 3.36218 7.32869 3.4261 7.37081 3.49407H10.5789C10.6211 3.4261 10.6723 3.36218 10.7325 3.30403L12.8538 1.25764C13.2342 0.890684 13.8368 0.890684 14.2172 1.25764C14.6175 1.64373 14.6175 2.28484 14.2172 2.67094L13.364 3.49407H14C16.2091 3.49407 18 5.28493 18 7.49407V12.9996C18 15.2087 16.2091 16.9996 14 16.9996H4C1.79086 16.9996 0 15.2087 0 12.9996V7.49406C0 5.28492 1.79086 3.49407 4 3.49407H4.58579L3.73252 2.67094ZM4 5.42343C2.89543 5.42343 2 6.31886 2 7.42343V13.0702C2 14.1748 2.89543 15.0702 4 15.0702H14C15.1046 15.0702 16 14.1748 16 13.0702V7.42343C16 6.31886 15.1046 5.42343 14 5.42343H4ZM5 9.31747C5 8.76519 5.44772 8.31747 6 8.31747C6.55228 8.31747 7 8.76519 7 9.31747V10.2115C7 10.7638 6.55228 11.2115 6 11.2115C5.44772 11.2115 5 10.7638 5 10.2115V9.31747ZM12 8.31747C11.4477 8.31747 11 8.76519 11 9.31747V10.2115C11 10.7638 11.4477 11.2115 12 11.2115C12.5523 11.2115 13 10.7638 13 10.2115V9.31747C13 8.76519 12.5523 8.31747 12 8.31747Z" fill="currentColor"></path></svg>'
    });
    myButton.addEventListener('click',() => {
        downloadfun(theurl,thename);
    })
    document.body.appendChild(myButton);
}



async function main() {
  "use strict";
    await sleep(5000);
     // 选中所有的<span>元素
    const spanElements = document.querySelectorAll('span.reply-content');
    getVideoName().then((resultObject) => {
         addDownloadButton(theurl,resultObject );
         console.log(resultObject);
     })

    // 遍历每个<span>元素
    spanElements.forEach((span, index) => {
        // 创建下载按钮
        const downloadButton = document.createElement('button');
        downloadButton.textContent = '下载';
        // 添加点击事件处理函数
        downloadButton.addEventListener('click', () => {
            // 获取相关信息(这里是<span>元素的文本内容)
            const content = span.textContent;
            mytext.push(content+"\n")
            // 弹出相关信息
            downloadButton.textContent = '已下载';
        });

        // 将下载按钮添加到<span>元素后面
        span.parentNode.insertBefore(downloadButton, span.nextSibling);
    });


}

main();
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值