Question

我想在当前网址上更改我的div样式。

如果我在我的主页上。

div.layout-column.column-main.with-column-1.with-column-2{
width:790;
}

如果我在除了我的主页之外的其他页面上，所以我希望我的课程如此。

div.layout-column.column-main.with-column-1.with-column-2{
width:590;
}

我尝试了但是没有得到正确的输出。

if (window.location.href == 'http://easyapuestas.com/')
{
  // alert("hiiii");
document.write("<style>" +
"div.layout-column.column-main.with-column-1.with-column-2{" +
" width: 790px;" +
"}" +
"</style>");
}
if (window.location.href !== 'http://easyapuestas.com')
{
// alert(window.location.href);
   document.write("<style>" +
 "div.layout-column.column-main.with-column-1.with-column-2{" +
 " width: 590px;" +
 "}" +
 "</style>");
}

Answer 1

尝试这样的事情：

$(document).ready(function() { 
   var width = window.location.href == 'http://easyapuestas.com/' ? '790px' : '590px';
   $('div.layout-column.column-main.with-column-1.with-column-2').css('width', width);
});

Answer 2

如果你给主页的body元素一个类或id，你应该能够在没有JS的样式表中做到这一点：

<body class="home">

然后：

div.layout-column.column-main.with-column-1.with-column-2{
   width:590px;
}

body.home div.layout-column.column-main.with-column-1.with-column-2{
   width:790px;
}

这是有效的，因为在主体没有类的页面上，只有第一个选择器匹配你的div，但是在主体的页面上>让类“home”两个选择器匹配你的div，在这种情况下，第一个被第二个覆盖。

Answer 3

我认为您尝试使用此

检查主页以外的页面

if (window.location.href == 'http://easyapuestas.com/')

{

这是错误，最好使用split（url）函数将其拆分为“/”，它将返回一个数组。然后你可以检查该数组的元素数量，我认为你可以使用这个

var url=window.location.href == 'http://easyapuestas.com/';
var split_arr=url.split("/");

//现在你可以检查这个数组的数量，如果它大于3，那么它不是主页

在当前URL上更改css

3 个答案: