Question

我想显示一个没有应用任何CSS的页面。是否有可能在页面内添加一个jquery开关来禁用所有样式表？

Answer 1

如果您想在点击后点击它：

$(".element").click(function(){
    $("link[rel='stylesheet']").remove();
});

或在开头：

 $(document).ready(function(){
        $("link[rel='stylesheet']").remove();
 });

Answer 2

试试这个：

$('link[rel="stylesheet"]').remove();

这将从页面中删除所有样式表（所有样式都适用于这些样式表）。

Answer 3

花了几分钟时间草拟一个

(function(f,a,s,x){ x=$(a);x.map(function(i,o){o=$(o);o.data(s+s,o.attr(s));o.removeAttr(s)}); $(s+',link[rel='+s+'sheet]').appendTo(f); setTimeout(function(){ $(a,f).appendTo('head'); x.map(function(i,o){o=$(o);o.attr(s,o.data(s+s))}) },999); })($('<i>'),'*','style');

Answer 4

全部禁用

StyleSheetList.prototype.forEach=Array.prototype.forEach;
document.styleSheets.forEach((ss)=>ss.disabled=true);

或（全部禁用）

for(styleSheet of document.styleSheets){ styleSheet.disabled=true; }

或（全部删除）

StyleSheetList.prototype.forEach=Array.prototype.forEach;
document.styleSheets.forEach((ss)=>ss.ownerNode.parentNode.removeChild(ss.ownerNode));

或（全部删除）

for(styleSheet of document.styleSheets){ styleSheet.ownerNode.parentNode.removeChild(styleSheet.ownerNode); }

Answer 5

试试这个

$('link[rel="stylesheet"]').remove();

Answer 6

将其放在准备好的文件上：

$('link[rel=stylesheet]').remove();

或将其绑定到按钮。

Answer 7

粗暴，肮脏和粗暴的做法：

document.querySelector("head").remove();

相同代码的bookmarklet版本，您可以将其粘贴为书签的URL。

您也可以将其粘贴到地址栏中（出于安全原因，当您粘贴文本时，chrome / firefox会在开头删除javascript:位，因此您需要手动输入）：

javascript:(function(){document.querySelector("head").remove();})()

Answer 8

使用下面的代码删除各种样式，内联、内部、外部。

let elements=document.querySelectorAll("*");
elements.forEach(el=>{
    if(el.tagName==="LINK" || el.tagName==="STYLE") el.remove();
    else el.removeAttribute("style");
});

谢谢我！ ;)

从页面中删除所有CSS样式表

8 个答案: