Javascript 在主页的正文中添加类

我正试图在主页上的body标签中添加一个类，并确保它是正确的。但是，它不起作用。我在干什么

<script type="text/javascript">
    $(document).ready(function() {
          if(window.location.href===window.location.hostname) {
               $("body").addClass("home");
           }
    });
</script>

我不这么认为

if(window.location.href===window.location.hostname) {
}

永远都是真的。主机名将托管类似stackoverflow.com的内容，其中href将包括协议、端口和其他可能是完整url的一部分的内容。你想看看

if(window.location.href.indexOf("home.html") != -1) {
}

或者类似的东西。但正如评论中指出的，如果生成html，只需将其添加到html文件或在服务器上进行添加似乎要简单得多。

我不这么认为

if(window.location.href===window.location.hostname) {
}

永远都是真的。主机名将托管类似stackoverflow.com的内容，其中href将包括协议、端口和其他可能是完整url的一部分的内容。你想看看

if(window.location.href.indexOf("home.html") != -1) {
}

---

或者类似的东西。但正如评论中所指出的，如果生成html，只需将其添加到html文件或在服务器上执行此操作似乎要简单得多。

不使用jquery也很容易

window.addEventListener("load", MyFunction);
function MyFunction(){
  if(window.location.origin == window.location.href) {
    var body = document.getElementsByTagName('body');
    body[0].className = "myclass";
  }
}

或

---

正文[0]，因为document.getElementsByTagName返回值是一个数组。

不使用jquery很容易

window.addEventListener("load", MyFunction);
function MyFunction(){
  if(window.location.origin == window.location.href) {
    var body = document.getElementsByTagName('body');
    body[0].className = "myclass";
  }
}

或

正文[0]因为document.getElementsByTagName返回值是一个数组。

window.location.href将永远不会与window.location.hostname相同，因为前者将包含协议部分，例如http://where，后者不包含协议部分。

window.location.href将永远不会与window.location.hostname相同，因为前者将包含协议部分部分例如：http://where，后者不包含。

window.location.href包含协议信息，永远不会与window.location.hostname相等

依照

window.location.href返回当前页面的href URL window.location.hostname返回web主机的域名 window.location.pathname返回当前页面的路径和文件名 您应该检查主页位置的路径名：

var path = window.location.pathname;
if (path == '/' || path == '/home.html') {
  $("body").addClass("home");
}

window.location.href包含协议信息，永远不会等于window.location.hostname

依照

window.location.href返回当前页面的href URL window.location.hostname返回web主机的域名 window.location.pathname返回当前页面的路径和文件名 您应该检查主页位置的路径名：

var path = window.location.pathname;
if (path == '/' || path == '/home.html') {
  $("body").addClass("home");
}

---

随着评论的发表，我开始思考。我试过这个，它成功了

<script type="text/javascript">
    $(document).ready(function() {
        switch (window.location.pathname) {
          case '':
          case '/index.php':
              $('body').addClass('home')
        }
    });
</script>

---

我忘了在问题中提到它是在一个PHP驱动的网站上。我回答了自己的问题，以帮助有一天可能会有完全相同问题的人。

随着评论的发表，我开始思考。我试过这个，它成功了

<script type="text/javascript">
    $(document).ready(function() {
        switch (window.location.pathname) {
          case '':
          case '/index.php':
              $('body').addClass('home')
        }
    });
</script>

---

我忘了在问题中提到它是在一个PHP驱动的网站上。我回答了自己的问题，以帮助有一天可能会有完全相同问题的其他人。

你需要jQuery来做吗？不需要。我实际上认为简单的旧javascript会更好。为什么不在HTML标记中设置类呢？我想知道你是如何调试它的，似乎很容易看出发生了什么wrong@anmarti如前所述，仅限于主页。您需要jQuery来完成吗？不。我实际上认为普通的旧javascript会更好。为什么不在HTML标记中设置类呢？我想知道你是如何调试它的，似乎很容易看出发生了什么wrong@anmarti如前所述，只有主页。你忘记了他检查页面是否为主页的部分，而你忘记了他检查页面是否为主页的部分though@AtheistP3ace您可能有许多URL以home结尾的页面。html@MaxZoom绝对正确。这就是为什么我说了一些这样的话，因为我不熟悉他的页面的结构和命名。@AtheistP3ace你可能有很多页面的URL以home结尾。html@MaxZoom绝对正确。这就是为什么我说了一些这样的话，因为我不熟悉他的页面结构和命名。