油猴插件,代码是ai写的,具体不懂。。。
// ==UserScript==
// @name NodeLoc 导航栏能量显示
// @namespace http://tampermonkey.net/
// @version 0.3
// @description 在导航栏显示能量数值(图标前置+黑色透明样式)
// @author You
// @match https://nodeloc.cc/*
// @grant GM_xmlhttpRequest
// @connect nodeloc.cc
// ==/UserScript==
(function() {
'use strict';
// 创建导航栏元素
function createNavItem() {
const li = document.createElement('li');
li.className = 'energy-display';
li.style.display = 'flex';
li.style.alignItems = 'center';
li.style.marginRight = '15px';
li.style.fontFamily = 'Arial, sans-serif';
li.innerHTML = `
<div style="display: flex; align-items: center;">
<div style="font-size: 18px; margin-right: 5px;">⚡</div>
<div style="text-align: right; line-height: 1.2;">
<div style="font-size: 12px; color: rgba(0,0,0,0.6);">能量值</div>
<div style="font-size: 16px; font-weight: bold; color: rgba(0,0,0,0.9);">加载中...</div>
</div>
</div>
`;
// 插入到导航栏第一个位置
const navBar = document.querySelector('ul.d-header-icons');
if (navBar) {
navBar.insertBefore(li, navBar.firstChild);
return li.querySelector('div > div:last-child > div:last-child');
}
return null;
}
// 获取并更新数据
function updateEnergy(displayElement) {
GM_xmlhttpRequest({
method: 'GET',
url: 'https://nodeloc.cc/leaderboard/1.json',
onload: function(response) {
try {
const data = JSON.parse(response.responseText);
if (displayElement) {
displayElement.textContent =
data.personal.user.total_score.toLocaleString();
// 添加数值透明度动画
displayElement.style.opacity = '0.8';
setTimeout(() => {
displayElement.style.opacity = '1';
}, 300);
}
} catch (e) {
if (displayElement) displayElement.textContent = '--';
}
},
onerror: function() {
if (displayElement) displayElement.textContent = '--';
}
});
}
// 等待导航栏加载
const observer = new MutationObserver(() => {
const navBar = document.querySelector('ul.d-header-icons');
if (navBar) {
observer.disconnect();
const displayElement = createNavItem();
if (displayElement) {
// 初始加载
updateEnergy(displayElement);
// 每30秒刷新
setInterval(() => updateEnergy(displayElement), 30000);
}
}
});
observer.observe(document, {
childList: true,
subtree: true
});
})();
效果图