Greasy Fork

Greasy Fork is available in English.

禁止 Web 延迟加载图片(一次性加载)

在 Web 页面中直接显示图片,禁止延迟加载,一次性加载所有图片

目前为 2023-11-21 提交的版本。查看 最新版本

// ==UserScript==
// @name         禁止 Web 延迟加载图片(一次性加载)
// @name:en      Disable web lazy loading images (one-time loading)
// @description  在 Web 页面中直接显示图片,禁止延迟加载,一次性加载所有图片
// @description:en Display images directly on the web page, disable lazy loading, load all images at once.
// @version      0.8
// @author       DUN
// @match        *://*/*
// @grant        none
// @run-at       document-start
// @namespace    http://greasyfork.icu/users/662094
// ==/UserScript==

(function() {
    'use strict';

    // 要排除的 URL 关键词列表
    const excludedKeywords = [
        'inoreader.com',
        'githubusercontent.com',
        'wp.com',
        'imgur.com',
        'cdn.com',
        'api.com',
        'play.com',
        'ico.com',
        'svg.com'
    ];

    // 检查 URL 是否包含排除的关键词
    function isExcluded(url) {
        return excludedKeywords.some(keyword => url.includes(keyword));
    }

    // 获取绝对 URL 地址
    function getAbsoluteImageUrl(relativeOrAbsoluteUrl) {
        if (relativeOrAbsoluteUrl.startsWith('http') || relativeOrAbsoluteUrl.startsWith('//')) {
            if (relativeOrAbsoluteUrl.startsWith('//')) {
                return window.location.protocol + relativeOrAbsoluteUrl;
            }
            return relativeOrAbsoluteUrl;
        } else {
            const a = document.createElement('a');
            a.href = relativeOrAbsoluteUrl;
            return a.href;
        }
    }

    // 更新图片源地址的函数
    function updateImageSource(imgElement) {
        let srcAttribute = imgElement.getAttribute("data-original") || imgElement.getAttribute("data-src");
        if (!srcAttribute) {
            return;
        }

        srcAttribute = getAbsoluteImageUrl(srcAttribute);
        if (isExcluded(srcAttribute)) {
            return;
        }

        // 移除延迟加载相关的元素或类
        const parentElement = imgElement.closest('.img-box');
        if (parentElement) {
            const maskElement = parentElement.querySelector('.n-img-mask');
            if (maskElement) {
                maskElement.remove();
            }
        }

        // 设置新的图片地址
        imgElement.src = srcAttribute;

        // 移除可能导致加载失败的属性
        imgElement.removeAttribute('data-src');
        imgElement.removeAttribute('srcset');
        imgElement.removeAttribute('sizes');
        imgElement.classList.remove('lazyload');
        imgElement.classList.remove('lazy');
    }

    // 使用 MutationObserver 来观察 DOM 变化
    const observer = new MutationObserver((mutations) => {
        mutations.forEach((mutation) => {
            if (mutation.type === 'attributes' && mutation.attributeName === 'data-src') {
                updateImageSource(mutation.target);
            } else if (mutation.type === 'childList' && mutation.addedNodes.length) {
                mutation.addedNodes.forEach((node) => {
                    if (node.tagName === 'IMG') {
                        updateImageSource(node);
                    } else if (node.querySelectorAll) {
                        node.querySelectorAll('img').forEach(updateImageSource);
                    }
                });
            }
        });
    });

    observer.observe(document.documentElement, {
        childList: true,
        subtree: true,
        attributes: true,
        attributeFilter: ['data-src']
    });

    window.addEventListener('DOMContentLoaded', () => {
        document.querySelectorAll('img').forEach(updateImageSource);
    });
})();