Greasy Fork

Greasy Fork is available in English.

禁止 Web 延迟加载图片（一次性加载）

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

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

// ==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.7.9
// @author       DUN
// @match        *://*/*
// @exclude      https://*.bilibili.com/*
// @exclude      https://*.cn/*
// @grant        none
// @run-at       document-start
// @namespace http://greasyfork.icu/users/662094
// ==/UserScript==

(function() {
    'use strict';

    // 要排除的 URL 关键词列表
    const excludedKeywords = [
        'inoreader',
        'chrome',
        'wp.com',
        'github',
        'blob',
        'gif',
        'imgur',
        'cdn',
        'api',
        'play',
        '.cn',
        '='
    ];

    // 检查 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 {
        // 处理相对路径，创建一个 a 元素来解析完整路径
        const a = document.createElement('a');
        a.href = relativeOrAbsoluteUrl;
        return a.href;
    }
}


    // 更新图片源地址的函数
    function updateImageSource(imgElement) {
        let srcAttribute = imgElement.getAttribute("data-src") || imgElement.getAttribute("src");
        if (srcAttribute) {
            // 获取绝对地址
            srcAttribute = getAbsoluteImageUrl(srcAttribute);

            // 检查是否包含排除关键词
            if (isExcluded(srcAttribute)) {
                return; // 如果包含排除关键词，则不进行任何操作
            }

            // 如果地址已经是代理地址，不做处理
            if (!srcAttribute.startsWith('https://images.weserv.nl/')) {
                // 移除协议部分
                let newSrc = srcAttribute.replace(/^https?:\/\//, '');

                // 添加代理前缀
                newSrc = 'https://images.weserv.nl/?url=https://' + newSrc;

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

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

    // MutationObserver 来观察 DOM 变化
    const observer = new MutationObserver((mutations) => {
        mutations.forEach((mutation) => {
            if (mutation.type === 'attributes' && (mutation.attributeName === 'data-src' || mutation.attributeName === '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);
                    }
                });
            }
        });
    });

    // 开始观察 DOM 变化
    observer.observe(document.documentElement, {
        childList: true,
        subtree: true,
        attributes: true,
        attributeFilter: ['data-src', 'src']
    });

    // 当文档加载完毕时，更新所有现有图片的源地址
    window.addEventListener('DOMContentLoaded', () => {
        document.querySelectorAll('img').forEach(updateImageSource);
    });
})();