ページを再読み込みせずにすべての画像の表示と非表示を簡単に切り替えることができる 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>
<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 などの「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
ページをリロードせずに、1 回のクリックでページ上のすべての画像を削除する方法を説明します。次のコード行を 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)}})();
次に、画像のある Web ページを開いて、このブックマークをクリックします。これで画像が消去されました。ただし、画像を戻すには、ページを更新する必要があります。