// ==UserScript== // @name HideImages // @name:zh-CN 隐藏图片 // @description Add a button to hide or show web images. Hide/show status will be remember by domain. // @description:zh-CN 在网页增加一个快捷按钮,一键隐藏/显示图片。隐藏/显示状态会根据域名被记住。 // @author Eric // @match *://*/* // @run-at document-start // @grant GM_getValue // @grant GM_setValue // @version 1.0.0 // @namespace https://greasyfork.org/users/1403857 // @downloadURL none // ==/UserScript== (function () { 'use strict'; const hiddenDomains = new Set(GM_getValue("hiddenDomains")); // 插入到页面中 let btnDom = document.createElement('div'); // 生成待插入的元素 btnDom.className = 'hi-btn'; if (hiddenDomains.has(document.location.hostname)) { btnDom.textContent = '显'; btnDom.style.backgroundColor = '#17b978'; } else { btnDom.textContent = '隐'; btnDom.style.backgroundColor = '#ff6f3c'; } document.body.appendChild(btnDom); // 再添加样式 let style = ` .hi-btn { position: fixed; right: 20px; bottom: 100px; z-index: 9999; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; background-color: #ff6f3c; border-radius: 10px; transition: all 0.5s; cursor: pointer; font-size: 20px; color: #ffffff; } ` let styleDom = document.createElement('style'); styleDom.innerHTML = style; document.head.appendChild(styleDom); // 处理事件 btnDom.addEventListener('click', function () { // 切换按钮文本内容 if (hiddenDomains.has(document.location.hostname)) { btnDom.textContent = '隐'; btnDom.style.backgroundColor = '#ff6f3c'; hiddenDomains.delete(document.location.hostname); } else { btnDom.textContent = '显'; btnDom.style.backgroundColor = '#17b978'; hiddenDomains.add(document.location.hostname); } console.log(hiddenDomains); GM_setValue("hiddenDomains", [...hiddenDomains]); hideMedia(); }) function hideMedia() { const show = !hiddenDomains.has(document.location.hostname); const images = document.querySelectorAll('img, image, photo, thumbnail, picture, gallery, icon, avatar, video, art-player-wrapper, imgbox-border, img-wrapper, goods'); // 遍历所有的图片元素,并设置它们的 display 样式为 none 或者 block images.forEach(function (element) { if (show) { element.style.display = ''; } else { element.style.display = 'none'; } }); // 针对小红书处理 const redImages = document.querySelectorAll('.cover.ld.mask'); redImages.forEach(function (element) { if (show) { element.style.display = ''; } else { element.style.display = 'none'; } }); // 小红书点击后的内容隐藏 const redImagesIn = document.querySelectorAll('.media-container'); redImagesIn.forEach(function (element) { if (show) { element.style.display = ''; } else { element.style.display = 'none'; } }); } setInterval(hideMedia, 300) })();