Vô hiệu hóa tất cả các biểu định kiểu CSS
Do hầu hết các trang hiện đại xác định tất cả các kiểu trong các tệp CSS bên ngoài được bao gồm trong <head>
, việc xóa head
thẻ sẽ loại bỏ hiệu quả tất cả các kiểu (ngoại trừ các kiểu nội tuyến rõ ràng và các kiểu được đặt bởi các tập lệnh). Nhấp chuột phải vào một trang, chọn Kiểm tra từ menu ngữ cảnh và dán mục này vào tab Bảng điều khiển:
document.head.parentNode.removeChild(document.head);
Và đây là phiên bản bookmarklet của mã ở trên có thể được dán dưới dạng URL của dấu trang (chuyển đổi thanh dấu trang trong Chrome bằng ⌘+ shift+ btrên Mac hoặc ctrl+ shift+ btrên Linux / Windows) :
javascript:(function(){document.head.parentNode.removeChild(document.head);})()
Bạn cũng có thể nhập mã ở trên trực tiếp vào thanh địa chỉ nhưng đọc ghi chú ở cuối câu trả lời trước khi bạn làm điều đó. .
Việc xóa <head>
cũng có thể được thực hiện từ tab devtools Elements , bằng cách nhấp chuột phải vào thẻ head và xóa nó thông qua menu ngữ cảnh:
LƯU Ý: Xóa thẻ đầu là một cách tiếp cận mạnh mẽ vì nó sẽ giết tất cả các kiểu, javascript, phông chữ web, v.v. và nếu nội dung trang được javascript hiển thị thì rất có thể bạn sẽ nhận được một trang trống. Trên phần lớn các trang web, nó có thể sẽ cung cấp cho bạn kết quả mong đợi.
Trường hợp sử dụng thường xuyên hơn là loại bỏ những thứ gây phiền nhiễu cụ thể trên một trang, chẳng hạn như màu sắc, lề, iframe, v.v. Trong trường hợp như vậy, một trong những bookmarklets sau sẽ cung cấp kiểm soát chi tiết hơn.
Xóa màu sắc, hình nền, lề, miếng đệm, chiều rộng
Tạo dấu trang và thêm đoạn mã sau dưới dạng 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';}})()
Bây giờ bạn có thể nhấp vào bookmarklet của mình để dọn sạch kiểu CSS trên trang hiện tại để dễ đọc hơn.
Lưu ý: Trên thực tế, có thể một trang có một <style>
khối bên trong <body>
thẻ - tiêu chuẩn HTML5 cho phép điều này và hầu hết các trình duyệt hỗ trợ nó. Cho đến nay, đây không phải là thông lệ, nhưng khi các khung web phát triển, chúng ta có thể thấy nhiều 'biểu định kiểu địa phương' hơn trong web tương lai.
Nếu bạn chỉ muốn cải thiện khả năng đọc thì việc tắt tất cả CSS có thể không cung cấp trải nghiệm tốt nhất. Đối với những trường hợp như vậy, bookmarklets dưới đây có thể cho kết quả tốt hơn:
Xóa các tiêu đề / chân trang không cuộn (tăng vùng đọc)
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);}}})()
Xóa iframe (giết hầu hết các biểu ngữ, v.v.)
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
Điều này cũng sẽ giết hầu hết các video nhúng, widget bình luận, v.v.
Xóa tất cả hình ảnh (duyệt chế độ văn phòng)
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';}})();
Lưu ý: cái này cần được sử dụng kết hợp với Xóa iframe ở trên, vì hầu hết các hình ảnh biểu ngữ thường nằm trong iframe và bookmarklet này chỉ hoạt động với tài liệu cấp cao nhất.
Các bookmarklets cũng có thể được sử dụng cho các trang web không hiển thị nội dung khi sử dụng trình chặn quảng cáo.
Bạn có thể sử dụng Trình tạo Bookmarklet để hủy mã hóa ( nút Định dạng ), chỉnh sửa mã cho phù hợp với nhu cầu của bạn và thu nhỏ lại ( nút Nén ) thành thứ gì đó bạn có thể dán làm URL dấu trang.
Các bookmarklets được liệt kê ở trên cũng sẽ hoạt động trên hầu hết các trình duyệt web di động trên cả iOS và Android. Các trình duyệt di động sẽ không chạy javascript từ thanh địa chỉ, nhưng bạn có thể thêm dấu trang, dán mã js làm URL, đặt nhãn, ví dụ clean
, sau đó chạy nó bằng cách nhấn vào mục trong menu dấu trang (đối với iOS safari) hoặc gõ clean
vào thanh địa chỉ và sau đó nhấn vào dấu trang tương ứng trong trình đơn thả xuống tự động đề xuất. Điều này có thể cải thiện khả năng đọc cho các trang không có chế độ đọc .
LƯU Ý: Nếu bạn sao chép và dán bookmarklets trực tiếp vào thanh địa chỉ, bạn sẽ thấy các trình duyệt loại bỏjavascript:
tiền tố - đây là một tính năng bảo mật của trình duyệt, vì vậy nếu bạn muốn kiểm tra bookmarklets trực tiếp từ thanh địa chỉ, thì bạn sẽ cần phải trả trước javascript:
bằng tay trước mã js.
Tiện ích mở rộng của Chrome
Nếu bạn đang tìm kiếm một tiện ích mở rộng chrome thì có uMatrix nơi bạn có thể nhấp vào cột CSS để tắt tất cả CSS và kiểu và Nhà phát triển web trong tab CSS bạn có tùy chọn Tắt tất cả các kiểu .