Nonaktifkan semua style sheet CSS
Mengingat bahwa sebagian besar halaman modern mendefinisikan semua gaya dalam file CSS eksternal yang termasuk dalam <head>
, menghapus head
tag akan secara efektif menghapus semua gaya (kecuali gaya inline eksplisit dan yang ditetapkan oleh skrip). Klik kanan pada halaman, pilih Periksa dari menu konteks dan tempel ini ke tab Konsol:
document.head.parentNode.removeChild(document.head);
Dan di sini adalah versi bookmarklet dari kode di atas yang dapat ditempelkan sebagai URL bookmark (beralih bilah bookmark di Chrome dengan ⌘+ shift+ bdi Mac atau ctrl+ shift+ bdi Linux / Windows) :
javascript:(function(){document.head.parentNode.removeChild(document.head);})()
Anda juga dapat mengetikkan kode di atas langsung ke bilah alamat tetapi baca catatan di akhir jawaban sebelum melakukannya. .
Menghapus <head>
juga dapat dilakukan dari tab Elemen devtools , dengan mengklik kanan tag kepala dan menghapusnya melalui menu konteks:
CATATAN: Menghapus tag kepala sedikit pendekatan brute force karena akan membunuh semua gaya, javascript, font web, dll, dan jika konten halaman dirender oleh javascript maka kemungkinan besar Anda akan mendapatkan halaman kosong. Pada sebagian besar situs mungkin akan memberi Anda hasil yang diharapkan.
Kasing penggunaan yang lebih sering adalah untuk menghapus hal-hal yang mengganggu tertentu pada halaman, seperti warna, margin, iframe, dll. Dalam kasus seperti itu, salah satu bookmarklet berikut akan memberikan kontrol lebih rinci.
Hapus warna, latar belakang, margin, bantalan, lebar
Buat bookmark dan tambahkan snippet berikut sebagai URL:
javascript:(function(){for(i=0;i<document.styleSheets.length;i++){document.styleSheets.item(i).disabled=true;}all=document.getElementsByTagName('*');for(i=0;i<all.length;i++){el=all[i];el.style.cssText='';el.style.width='';el.style.padding='0px';el.style.margin='2px';el.style.backgroundImage='none';el.style.backgroundColor='#fff';el.style.color='#000';}})()
Sekarang Anda dapat mengklik bookmarklet Anda untuk membersihkan gaya CSS pada halaman saat ini untuk sesuatu yang lebih mudah dibaca.
Catatan: Faktanya, sebuah halaman mungkin memiliki <style>
blok di dalam <body>
tag - standar HTML5 memungkinkan ini dan sebagian besar browser mendukungnya. Sejauh ini ini bukan praktik umum, tetapi karena kerangka kerja web berkembang, kita mungkin melihat lebih banyak 'style sheet lokal' di web masa depan.
Jika Anda hanya ingin meningkatkan keterbacaan maka menonaktifkan semua CSS mungkin tidak memberikan pengalaman terbaik. Untuk kasus seperti itu, bookmarklet di bawah ini mungkin memberikan hasil yang lebih baik:
Hapus header / footer yang tidak bergulir (menambah area baca)
javascript:(function(){var elems=document.body.getElementsByTagName("*");var len=elems.length;for(var i=0;i<len;i++){var pos=window.getComputedStyle(elems[i],null).getPropertyValue('position');if(pos=='fixed'||pos=='sticky'){var el=elems[i];el.parentNode.removeChild(el);}}})()
Hapus iframe (bunuh sebagian besar spanduk, dll)
javascript:var frames %3D document.getElementsByTagName%28"iframe"%29%3Bfor %28%3Bframes.length%3B%29 %7Bframes%5Bframes.length-1%5D.parentNode.removeChild%28frames%5Bframes.length-1%5D%29%3B%7Dvoid%280%29
Ini juga akan membunuh sebagian besar video tertanam, widget komentar, dll.
Hapus semua gambar (penjelajahan mode kantor)
javascript:(function(){function toArray(c){var a,k;a=new Array;for(k=0;k<c.length;++k)a[k]=c[k];return a;}var images,img,altText;images=toArray(document.images);for(var i=0;i<images.length;++i){img=images[i];altText=document.createTextNode(img.alt);img.parentNode.replaceChild(altText,img)}var alle=document.getElementsByTagName("*");for(var i=0,max=alle.length;i<max;i++){alle[i].style.backgroundImage='none';}})();
Catatan: yang ini perlu digunakan dalam kombinasi dengan Hapus iframe di atas, karena sebagian besar gambar spanduk biasanya di dalam iframe dan bookmarklet ini hanya berfungsi dengan dokumen tingkat atas.
Bookmarklet juga dapat digunakan untuk situs yang tidak akan menampilkan konten saat pemblokir iklan digunakan.
Anda dapat menggunakan Bookmarklet Builder untuk menghapus kode tersebut ( tombol Format ), mengeditnya sesuai dengan kebutuhan Anda, dan memperkecilnya kembali ( tombol Kompres ) ke sesuatu yang dapat Anda tempelkan sebagai URL bookmark.
Bookmarklets yang tercantum di atas juga akan berfungsi di sebagian besar browser web seluler di iOS dan Android. Peramban seluler tidak akan menjalankan javascript dari bilah alamat, tetapi Anda dapat menambahkan bookmark, menempelkan kode js sebagai URL, mengatur label, misalnya clean
, dan kemudian menjalankannya dengan mengetuk item di menu bookmark (untuk iOS safari) atau mengetik clean
di bilah alamat dan kemudian mengetuk bookmark yang sesuai di dropdown sugesti otomatis. Ini dapat meningkatkan keterbacaan untuk halaman yang tidak memiliki mode membaca .
CATATAN: Jika Anda menyalin dan menempel bookmarklet di atas langsung ke bilah alamat, Anda akan melihat bahwa browser menghapusjavascript:
awalan - ini adalah fitur keamanan browser, jadi jika Anda ingin menguji bookmarklet langsung dari bilah alamat, maka Anda akan perlu diawali javascript:
secara manual sebelum kode js.
Ekstensi Chrome
Jika Anda mencari ekstensi chrome maka ada uMatrix di mana Anda dapat mengklik kolom CSS untuk menonaktifkan semua CSS dan gaya, dan Pengembang Web di mana di bawah tab CSS Anda memiliki opsi Nonaktifkan Semua Gaya .