更改页面时可以更改脚本中的类名吗

Question

大家好，
我有一个问题。我编写了一个非常广泛的脚本来将我的身体背景从特定于页面的背景图像更改为其他背景图像。供参考：

我的“mypage.html”在 default 样式表中定义了默认背景 class='image1'。
我编写了一个脚本来将其更改为class='image10' 或 class='image11'，它们在持久样式表中定义。 （相信我，这是简短的版本，但这部分有效......好吧，将会。这里没有问题。）
我的“otherpage.html”有一个默认背景 class='image2' 定义在默认样式表，我希望能够将其更改为持久样式表中相同的“image10”和“image11”。
两个默认背景都有多个不同颜色的版本备用样式表...将样式表和 class='image1' 链接更改为图像的另一个版本。
所有这些都由特定于页面的 cookie 控制。这使得找到解决方案变得非常重要，因为否则我将不得不为每个页面设置 cookie。我觉得这是不可接受的。
我的问题是，我是否必须将整个脚本复制/粘贴到我的“otherpage.html”并将所有“image1”更改为“Image2”，或者有什么办法javascript 类似：

if(HTML = 'otherpage.html') {
   (".image1" = ".image2")
}

请原谅我非常业余的脚本。我已经全部看过，但我什至不知道如何搜索这个...希望有人可以提供帮助，否则复制/过去它是；）

Answer 1

您可以在此处使用这个小脚本

var currentPage =  window.location.pathname;

if (currentPage == "/somepage.html") {
   // change the body class name
   document.getElementsByTagName("body")[0].className = "image2";
}

。如果您有多个页面要测试，则可以使用 switch 语句。

Answer 2

您可以通过基类控制样式（背景和其他样式），您可以将其设置为文档或任何根容器的 body 标签。在页面加载时检查页面名称并相应地设置类名称。

if(page == "otherPage"){
  document.body.className = "image2";
}

现在所有属于 image2 的类都将被应用。