使用JavaScript/jQuery删除/更改内部样式表样式_Javascript_Jquery

使用JavaScript/jQuery删除/更改内部样式表样式

javascript jquery

使用JavaScript/jQuery删除/更改内部样式表样式,javascript,jquery,Javascript,Jquery,我希望能够通过JavasScript删除/更改内部样式表的值。它必须通过JS，因为我无法编辑html，因为我使用的应用程序不允许我编辑html，但我可以使用JS。如何更改背景的值或将其完全删除？还是有其他方法来实现这一点 <body> <head> <style type="text/css"> #company-header{background:#000 !important;} </style> </head> &l

我希望能够通过JavasScript删除/更改内部样式表的值。它必须通过JS，因为我无法编辑html，因为我使用的应用程序不允许我编辑html，但我可以使用JS。如何更改背景的值或将其完全删除？还是有其他方法来实现这一点

<body>
<head>
  <style type="text/css">
  #company-header{background:#000 !important;}
  </style>
</head>

<div id="company-header"></div>
</body>


#公司标题{背景：#000！重要；}

编辑：好的，现在我们了解到这个问题实际上只是关于如何覆盖！重要的样式声明通过javascript设置样式时，这是此帖子的副本：

两个可能的答案是在对象上设置一个完整的样式字符串，或者创建一个引用此对象的新样式表

问题编辑前的上一个答案：

如果需要，可以直接在对象上设置一些样式。这将覆盖来自样式表的任何内容，因此您不必弄乱样式表

$("#company-header").css("background-color", "#FFFFFF");

或

修改对象或对象组外观的一种更具扩展性的方法是基于类名的样式设置，然后使用jQuery添加/删除类名。这样可以切换应用于给定对象的样式表规则，而无需直接操作样式表本身：

$("#company-header").removeClass("oldClass").addClass("newClass");

如果您只是想更改一小部分css，那么使用jQuery的css（）是您最好的选择，但它并不总是能够识别！重要的是，为此，您可能需要cssText，如下所示：

$('#id').css('cssText', 'height: 200px !important');

$(document).removeAttr('style');

这将替换所有css，因此所有内容都需要在添加的新css规则中定义

如果您正在更改大量的css，或者只是想让下一次更容易，那么可以删除所有内联css并添加一个外部样式表

要删除所有内联样式，请执行以下操作：

$('#id').css('cssText', 'height: 200px !important');

$(document).removeAttr('style');

或是只供div使用

$('div').removeAttr('style');

根据有多少种样式，这可能需要som时间来处理

然后，要添加新样式表，请执行以下操作：

(function() {
    var myCSS = document.createElement('link');
    myCSS.rel = 'stylesheet';
    myCSS.type = 'text/css';
    myCSS.src = '/styles/mystylesheet.css';
    var place = document.getElementsByTagName('script')[0];
    place.parentNode.insertBefore(myCSS, place);
})();

编辑：

function removeCSS() {
    var badCSS = document.getElementsByTagName('style')[0];
        $(badCSS).remove();     
});

这将删除内部样式表中的所有标记，但由于样式已经加载，因此完全没有区别

内部样式将始终覆盖外部样式，但对于一个例外，如果外部样式为！重要的。如果外部和内部样式都相同！重要的是，将使用内部样式

只有当您试图覆盖的所有内容都设置为“0”时，才能使用javascript动态加载外部样式表！在外部样式表中很重要，且未设置为！在内部样式表中很重要

$(document).ready(function(){
        $('style').remove();
    });

使用jQuery的css（）直接在DOM中更改样式，并使用cssText选项覆盖！如果绝对无法更改html文件和删除内部样式表，则内部样式表中的重要设置可能是唯一可行的选项

$(document).ready(function(){
        $('style').remove();
    });

此代码将从站点中删除所有内部css。我使用了这个，但是样式标记将在页面源代码中可见。

您是否已经从页面引用了jQuery？我之所以这样问是因为如果你不能使用html，你会如何添加jQuery或JavaScript代码？jQuery已经在网站上使用过了。在网站的后端是可编辑区域，可以包含JS，但通常只用于添加html。这正是我试图做的，但由于某些原因IE6、7、8和所有Firefox都无法识别.css（）。它在Chrome、Safari和Opera中工作。使用逗号是行不通的。我必须使用冒号并指定！重要信息，因为内部样式已设置为！重要的$css（{'background'：'none！important'}）；你忘了包括关于你的信息！在你的第一篇文章中很重要（我看到你现在已经编辑了它）。那么，你的问题现在解决了吗？不，还没有解决。我把它放进去了！重要的是要进一步阐述我试图解决的问题。内部样式表中的CSS具有！重要的是，所以我补充说！对JS也很重要。这在Chrome、Opera等浏览器中是有效的，但在IE和Firefox中是无效的。css是一种jQuery方法，jQuery是完全跨浏览器兼容的，因此只需确保页面中包含了jQuery文件。事实上，.css方法与外部样式表无关，它只会更改应用于DOM对象的css。（如果外部样式表中有！重要信息，请将其删除，因为这可能会使外部样式表属性的优先级高于脚本）感谢您的回复。删除样式会很好，但它们不是内联的。它们位于内部样式表中。如何定位它们？@kfawcett：您应该加载自己的自定义样式表（或创建自己的

样式

元素），然后覆盖“内部样式表”中定义的任何内容，并确保包含

！重要信息

。这是唯一的办法。忘记任何关于“删除样式”的想法。如果我的评论对您没有意义，请告诉我，我会写一个完整的答案。@adeneo这是可行的，但我如何添加多个属性？我想更改背景、填充和边框$（'#id'）.css（'cssText'，'height:200px！important'）@阿迪内奥：谢谢！这让我走上了正确的方向，并发挥了作用$（'#id'）.css（'cssText'，'height:200px！important'）；我最终发现这可以添加多个属性。