☰

Firefox - 設定/擴充功能在顯示和隱藏所有圖像之間切換，無需重新載入頁面

tag-icon • tag-icon firefox browser browser-addons firefox-extensions
Firefox - 設定/擴充功能在顯示和隱藏所有圖像之間切換，無需重新載入頁面

我正在尋找一個Firefox 設定或擴展，可以輕鬆地在顯示和隱藏所有圖像之間切換，而無需重新加載頁面（類似於Opera 的功能- “僅顯示緩存的圖像”功能更可取，但在我的情況下是可選的）。

我找到了一個可以顯示/隱藏圖像的擴充功能（影像顯示隱藏）但需要重新載入頁面才能顯示/隱藏圖像。

我希望在從之前設定為隱藏所有圖像的頁面中取消隱藏圖像時，頁面不重新載入。

答案1

影像首選項是一個擴展，允許您在不重新加載的情況下切換圖像顯示，儘管主頁確實提到它可能在某些（未命名）情況下不起作用。我注意到如果有很多打開的選項卡，它的運行速度會很慢。

如果您願意接受權衡，這裡有另一個書籤，它可以滿足您的要求：

javascript:(function(){function%20toggleImages(root){var%20stylesheet,stylesheetId='bookmarklet-hide-image-stylesheet',rules='*%20{%20background-image:%20none%20!important;%20}%20img,%20input[type=image],%20object[type^=image]%20{%20visibility:%20hidden%20!important;%20}',tagNames=['frame','iframe'],elements,i,j;stylesheet=root.getElementById(stylesheetId);if(stylesheet){stylesheet.parentNode.removeChild(stylesheet);}else{stylesheet=root.createElement('style');stylesheet.type='text/css';stylesheet.id=stylesheetId;if(stylesheet.styleSheet){stylesheet.styleSheet.cssText=rules;}else{stylesheet.appendChild(root.createTextNode(rules));}root.getElementsByTagName('head')[0].appendChild(stylesheet);}for(i=0;i<tagNames.length;i+=1){for(j=0,elements=root.getElementsByTagName(tagNames[i]);j<elements.length;j+=1){toggleImages(elements[j].contentDocument);}}}toggleImages(document);}());

它嘗試隱藏和取消隱藏背景圖像、<img>標籤<input>和<object>帶有標籤的標籤type="image"，但仍然有許多奇怪的圖像傳遞方法它無法識別，例如帶有標籤的<embed>或<object>s <param>。由於瀏覽器安全措施（通常在 中有廣告時很明顯<iframes>），它無法跨域工作，並且它可能會被用戶樣式表覆蓋，或者如果頁面使用!important.

有興趣的可以閱讀原始碼：

(function () {
    function toggleImages(root) {
        var stylesheet,
            stylesheetId = 'bookmarklet-hide-image-stylesheet',
            rules = '* { background-image: none !important; } img, input[type=image], object[type^=image] { visibility: hidden !important; }',
            tagNames = ['frame', 'iframe'],
            elements,
            i,
            j;

        stylesheet = root.getElementById(stylesheetId);
        if (stylesheet) {
            stylesheet.parentNode.removeChild(stylesheet);
        } else {
            stylesheet = root.createElement('style');
            stylesheet.type = 'text/css';
            stylesheet.id = stylesheetId;
            if (stylesheet.styleSheet) {
                stylesheet.styleSheet.cssText = rules;
            } else {
                stylesheet.appendChild(root.createTextNode(rules));
            }
            root.getElementsByTagName('head')[0].appendChild(stylesheet);
        }

        for (i = 0; i < tagNames.length; i += 1) {
            for (j = 0, elements = root.getElementsByTagName(tagNames[i]); j < elements.length; j += 1) {
                toggleImages(elements[j].contentDocument);
            }
        }
    }

    toggleImages(document);
}());

答案2

你不需要 JavaScript。 OP 想要一種簡單的方法來切換圖像而不重新載入頁面，這裡是：

使用 Firefox/Chrome/etc 的“Stylish”擴展，然後使用我在下面添加的程式碼。它將適用於所有網站，並將隱藏所有圖像、影片（嵌入）和背景圖像。

@namespace url(http://www.w3.org/1999/xhtml);
/*Hide Images*/
IMG { display: none !important }
/*Hide Videos*/
iframe { display:none !important }
/*Hide Background*/
body {background:none !important }
a {background:none !important }
div {background-image:none !important }
div {background:none !important }

答案3

我可以告訴您如何一鍵刪除頁面上的所有圖像，而無需重新載入頁面。只需將以下程式碼行儲存為 Firefox 書籤工具列上的書籤，並將其命名為「zap images」。

javascript:(function(){function%20toArray%20(c){var%20a,%20k;a=new%20Array;for%20(k=0;%20k%20<%20c.length;%20++k)a[k]=c[k];return%20a;}var%20images,%20img,%20altText;images=toArray(document.images);for%20(var%20i=0;%20i%20<%20images.length;%20++i){img=images[i];altText=document.createTextNode(img.alt);img.parentNode.replaceChild(altText,%20img)}})();

現在，打開一個包含圖像的網頁，然後點擊此書籤。你剛剛修改了圖片。但是，為了將它們恢復，您需要刷新頁面。

相關內容