【油猴脚本】修改掘金背景图，设置自己喜欢的背景图！

Paul3

[JavaScript] 纯文本查看 复制代码

// ==UserScript==
// [url=home.php?mod=space&uid=170990]@name[/url]         juejinBackgroundImage
// [url=home.php?mod=space&uid=467642]@namespace[/url]    http://tampermonkey.net/
// [url=home.php?mod=space&uid=1248337]@version[/url]      0.2.1
// @description  修改掘金背景图，设置自己喜欢的背景图！
// [url=home.php?mod=space&uid=686208]@AuThor[/url]       wjh
// [url=home.php?mod=space&uid=195849]@match[/url]        https://juejin.cn
// @match        https://juejin.cn/*
// @match        https://www.zhihu.com/*
// [url=home.php?mod=space&uid=593100]@Icon[/url]         https://p9-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/849e3902e63a42cea93abb448cb0bb0f~tplv-k3u1fbpfcp-watermark.image
// @require      https://cdn.bootcdn.net/ajax/libs/jquery/3.2.1/jquery.min.js
// [url=home.php?mod=space&uid=609072]@grant[/url]        none
// ==/UserScript==

(function() {
    'use strict';

    $(document).ready(function(){
        // 图片路径
        let imgUrl = window.localStorage.getItem('imgUrl') || 'https://p9-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/9d58e69aaefa4aa59fdd61f1a58ede84~tplv-k3u1fbpfcp-watermark.image'
        let uploadBox = "<div id='uploadBox' style='position:fixed;top:80px;right:20px;background:rgba(255,255,255,0.5);padding: 10px;'><input style='width:66px;' type='file' name='' id='files'></div>"

        $('#juejin').css('backgroundImage',`url(${imgUrl})`);
        $('#juejin').css('backgroundSize',`100%`);
        $('.App-main').css('backgroundImage',`url(${imgUrl})`);
        $('.App-main').css('backgroundSize',`100%`);

        $('body').append(uploadBox);


        $("#files").change(function(e) {
            readFileAsDataURL($('#files')[0].files[0]).then(dataURL => {
                window.localStorage.setItem('imgUrl',dataURL)
                $('#juejin').css('backgroundImage',`url(${dataURL})`);
                $('.App-main').css('backgroundImage',`url(${dataURL})`);
            });
        })
    })


    function readFileAsDataURL(file) {
        return new Promise((resolve, reject) => {
            let reader = new FileReader();

            reader.onload = function(event) {
                resolve(event.target.result);
            };

            reader.onerror = function(event) {
                reject(new Error("File could not be read! Code " + event.target.error.code));
            };

            reader.readAsDataURL(file);
        });
    }



    // Your code here...
})();

林伊轩

https://greasyfork.org/zh-CN/scripts/469705-juejinbackgroundimage

你直接发这个链接更好

Paul3

https://greasyfork.org/zh-CN在油叉上搜索juejinBackgroundImage安装也可以哦

zpy2

https://juejin.cn/book/725525831 ... 7255258317021249577

这个页面可以加载 显示 选择文件 按钮，可以上传自己的背景。
https://juejin.cn/post/7258952063219384376
这个页面背景是变了，但是 选择文件 这个按钮 不显示，很奇怪

Paul3

林伊轩 发表于 2023-7-27 23:03
https://greasyfork.org/zh-CN/scripts/469705-juejinbackgroundimage

你直接发这个链接更好

是哦，忘记了

Paul3

zpy2 发表于 2023-7-28 08:59
https://juejin.cn/book/7255258316727648267/section/7255258317021249577

这个页面可以加载 显示 选择 ...

有的页面html结构不同，或者被里面的元素遮住了