惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

大猫的无限游戏
大猫的无限游戏
MyScale Blog
MyScale Blog
雷峰网
雷峰网
量子位
小众软件
小众软件
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻
博客园 - 叶小钗
T
Tailwind CSS Blog
月光博客
月光博客
博客园 - 【当耐特】
博客园_首页
罗磊的独立博客
博客园 - 三生石上(FineUI控件)
IT之家
IT之家
爱范儿
爱范儿
阮一峰的网络日志
阮一峰的网络日志
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
WordPress大学
WordPress大学
The Cloudflare Blog
freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More
S
SegmentFault 最新的问题
人人都是产品经理
人人都是产品经理
V
V2EX
酷 壳 – CoolShell
酷 壳 – CoolShell

Allen Hua 的网络博客

由于 Linux 桌面没有一个好用的天气程序就写了一个跨平台的CheckitoutWeather 给 caesium-image-compressor 图片压缩程序构建了 Linux AppImage v2.8.5 最新版 debian13(debian trixie)安装了nvidia闭源驱动后从x11切换到wayland的方法 山间摩旅追风,偶遇一场绚烂晚霞 最近使用debian系统的一些心得 机械革命无界14Pro笔记本debian forky成功驱动内置扬声器和麦克风 记录 typecho 1.2.0 升级到 1.3.0 过程 开发了一款openwrt插件:文本剪贴板 解决机械革命笔记本内屏高刷240Hz闪屏问题 使用 Java 写了一个局域网端口扫描器 - Allen Hua 的网络博客 openwrt使用外置根extroot机制扩展根分区大小 - Allen Hua 的网络博客 将机场ss节点批量转换成ss字符串链接批量添加到passwall - Allen Hua 的网络博客 给机械革命钛钽plus换屏:NY2换成NZ2 - Allen Hua 的网络博客 记录一次pve宿主机和上面的debian虚机无故down机事件 - Allen Hua 的网络博客 给图床部署cdn腾讯云的edgeone并排查Cache-Control max-age 3600的问题 - Allen Hua 的网络博客 从高山草甸到徽派古村:武功山反穿与皖浙赣自驾行记 - Allen Hua 的网络博客 增程器就是充电宝?别被忽悠了 - Allen Hua 的网络博客 浦口龙虎巷扫街,记录人间真实 博客图片压缩方案更新|AVIF|WebP|MozJPEG|标准JPEG Windows 电脑使用 Obs Studio 录制各个网站视频/桌面画面教程 为typecho博客添加latex支持 新能源汽车之纯电车使用交流慢充和直流快充的充电损耗对比 2025年3月更新全国5A景区名录 2025最新查看小米/红米手机电池健康度和循环次数方法 完美解决 seafile FILE_SERVER_ROOT 配置导致的内网外网不能同时访问和上传下载的问题 纯css实现typecho博客文章文字spoiler剧透效果 我对Typecho Facile主题的一些修改,图片懒加载优化,样式定制 2024年8月我的宜昌 - 重庆 - 川西小环线自驾旅行分享 2022年打卡南京市区人防工程纳凉点 2024年带着A7C2+腾龙28-200 再次来到红山森林动物园
使用JavaScript脚本快速获取B站观看历史记录页面的视频标题和URL
Allen Hua · 2024-07-09 · via Allen Hua 的网络博客
阅读量:2755

warning: 这篇文章距离上次修改已过686天,其中的内容可能已经有所变动。

哔哩哔哩观看历史记录的页面地址是 https://www.bilibili.com/account/history

有时候我想分享最近观看的几个视频给朋友,尤其是在我使用关键字搜索之后的列表,会有好几个条目,一个一个打开并复制出一个干净的标题和干净的视频地址太麻烦了。于是我用js写了一段脚本快速获取页面上的视频标题和URL

源码如下

// 使用 querySelectorAll 选择符合路径的 div
const targetDiv = document.querySelector('#history_list');

// 检查 targetDiv 是否存在
if (targetDiv) {
    // 在 targetDiv 内选择所有的 li 标签
    const liTags = targetDiv.querySelectorAll('li');
    let title_url = '';

    // 遍历每一个 li 标签,获取其内容
    liTags.forEach(liTag => {
        const titleA = liTag.querySelector('a.title'); // 获取 class 名称是 title 的那个 a 标签
        if (titleA) {
            let url = titleA.getAttribute('href'); // 获取链接地址
            let title = titleA.textContent;
            if (url) {
                let originStr = url.trim(); // 原始字符串
                url = `https:${originStr.replace(/\?.*$/, '')}`; // 利用正则格式化,前面拼上 https: 顺便把半角问号和后面的字符串都remove掉
                title_url += '- ' + title + ' ' + url + '\n'; // 拼接英文减号和空格,再拼上视频标题和空格,最后拼上视频地址
            } else {
                title_url += '- No title attribute\n'; // 如果没有 title 属性,添加提示
            }
        }
    });
    console.log(title_url)
} else {
    console.log('无法找到目标 div');
}

使用方法

  1. 打开历史记录页面,搜索某关键词(搜索是可选项,不搜索也可以,但是js脚本只会收集出页面已加载的内容)
  2. 按下键盘F12,切换到 Console 标签
  3. 粘贴如上代码后回车即可。如果此网站不允许粘贴,临时在Console中键入allow pasting 回车即可。不过B站的web是允许粘贴的

举例,我使用富士搜索出如下视频

富士搜索结果.jpg

执行js代码之后快速获取了这些视频的标题和URL

执行后效果.jpg

刚好我顺手记录一下这些视频的地址。下面各二级标题就是我使用标题搜出来的结果(基于我最近观看的视频)。不太清楚,B站历史记录的最大条目好像是 1000?(有知道的朋友欢迎留言评论)

富士

索尼

直出

创意外观

ok, that's all.