Question

我正在为多个页面使用3个样式表（style1，style2，style3）。

style1我的网页标题
style2我的内容和
style3 for footer

现在我想在我的主页上应用新的stylesheet，并仅在主页上禁用style2。

我为不同的元素添加了新类，但在某些地方它仍在检测我以前的stylesheet。如何在特定页面上禁用CSS？

Answer 1

由于您没有包含代码以查看您是如何操作的，并且考虑到您将标头作为包含文件：

使用PHP：

在包含标题之前的主页中：

<?php $homepage = 1; ?>

//include your header//

在引用CSS的标题中：

<link href="css/style1.css" rel="stylesheet" type="text/css" />

<link href="css/style3.css" rel="stylesheet" type="text/css" />

<link href="<?php if($homepage == 1){ echo "css/Home-style.css";}else{ echo "css/style2.css";}?>" rel="stylesheet" type="text/css" />

您的文件应该是PHP格式才能生效。改变＆＃34; Home-style.css＆＃34;到主页的新CSS文件。

Answer 2

您必须使用jQuery来禁用stylesheet，如：

<script>
$(function () {
  if (location.pathname.indexOf('/pagename') >= 0) {
    $('link[href*="/media/css/csspagename.css"]').prop('disable', true);
  }
});
</script>

Answer 3

检查页面然后获取dom stylesheets数组对象并禁用您想要的任何内容。

if(window.location.href.indexOf("<name in page url >") > -1) {

//Next line will disable the 2nd stylsheet in the document . 

 document.styleSheets[1].disabled = true;

}

另外，您可以使用以下方式查看dom中的所有样式表：

console.log(document.styleSheets)

这应该为您提供要删除的样式表的适当索引。

如何在特定页面上禁用CSS？

3 个答案: