如何为自己的头像添加挂件

最近论坛更新了,有些用户出现了特殊的头像挂件效果。
image
咱们普通用户是没有的,不过今天我们通过一段油猴脚本来实现此功能。

废话不多说直接上GPT写的油猴脚本:

// ==UserScript==
// @name         Linux Do图像挂件
// @namespace    http://tampermonkey.net/
// @version      2.0
// @description  为你的头像添加挂件。本代码为AI生成,纯属娱乐。
// @author       You
// @match        https://linux.do/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=linux.do
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    var currentUserElement = document.getElementById('current-user');
    var userId;
    if (currentUserElement) {
        var buttonElement = currentUserElement.querySelector('li > button');
        if (buttonElement) {
            var hrefValue = buttonElement.getAttribute('href');
            userId = hrefValue.replace('/u/', '');
        }
    }

    // 功能函数:根据userId更新<a>标签和<img>元素
    function updateUserElements() {
        var links = document.querySelectorAll('a[href="/u/' + userId + '"]');
        links.forEach(function(link) {
            var img = link.querySelector('img');
            if (img && !img.style.border) {
                img.style = 'border: 3px solid rgb(0, 174, 255)!important; box-shadow: 0 0 5px #3498db!important';
            }

            if (!link.nextSibling || !link.nextSibling.classList.contains('avatar-flair')) {
                var newDiv = document.createElement('div');
                newDiv.className = 'avatar-flair avatar-flair-trust_level_3 rounded avatar-flair-image';
                newDiv.style = 'background-image: url(https://cdn.linux.do/uploads/default/original/3X/9/d/9d8a9be47928b3e1a35aaf632f9eeafa32600765.png); background-color: #b30b0b; color: #fff';
                newDiv.title = 'trust_level_3';
                link.parentNode.insertBefore(newDiv, link.nextSibling);
            }
        });
    }

    // 初始更新
    if (userId) {
        updateUserElements();
    }

    // 创建一个观察器实例并传入回调函数
    var observer = new MutationObserver(function(mutations) {
        mutations.forEach(function(mutation) {
            mutation.addedNodes.forEach(function(node) {
                if (node.nodeType === Node.ELEMENT_NODE) {
                    if (node.matches('a[href="/u/' + userId + '"]') || node.querySelector('a[href="/u/' + userId + '"]')) {
                        updateUserElements();
                    }
                }
            });
        });
    });

    // 配置观察器选项
    var config = { childList: true, subtree: true };

    // 传入目标节点和观察器的配置
    observer.observe(document.body, config);
})();

使用方式:点击油猴插件–添加新脚本,然后复制上述代码到编辑框。最后保存刷新即可!

5 个赞

这就是大佬的世界么

1 个赞

我怎么看不见你的头像效果呢

14 个赞

其实我也没看见

2 个赞

掩耳盗铃听过吗 :rofl:

3 个赞

对哦,楼主自己的效果呢?

2 个赞

始皇同款

2 个赞

这不是始皇独有的吗

2 个赞

不错、不错

2 个赞

可以的,相当可以

2 个赞

始皇那是全员可见,好家伙,你这是仅自己可见是吧 :saluting_face:

2 个赞

大胆,给你关小黑屋里头

2 个赞

现在没有呼吸特效了,始皇取消了,但是点自己头像

1 个赞

佬你的火有点怪 :dotted_line_face:

1 个赞

怎么感觉呼吸暂停了

1 个赞

这个不属于入侵计算机系统吧:sweat_smile:

:joy: :joy:

我们是想成为别人眼中的我,还是想成为自己眼中的我:thinking::thinking::thinking:

1 个赞

掩耳盗铃 :joy:

1 个赞

:face_with_peeking_eye: :crazy_face:你管我

1 个赞