哔哩哔哩观看历史记录的页面地址是 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.