php - 仅在加载 wordpress 索引时才显示 div 的简单功能

Question

我只是在学习 Wordpress 结构和 javascript/php，所以我希望有人能帮我解决这个问题。

我想要做的是显示一个我放在 header.php 中的 div，但只有当它是加载的 'index.php' 文件时。

不应该是这样的吗？

$(document).ready(){
    if.this(document == "http://sample.com/") {
        this.document.getElementById('only-show-when-index').style.display = "visible";
    } else {
        this.document.getElementById('only-show-when-index').style.display = "hidden";
    }
};

Answer 1

您有一些语法错误，并且您不在“this”可以工作的上下文中：

if (window.location.href == 'http://sample.com/'){
     document.getElementById('only-show-when-index').style.display = "block";
}else{
      document.getElementById('only-show-when-index').style.display = "none";
}

Answer 2

fred2 已经很好地解决了语法错误。但是，由于 jQuery 已经加载，您可以使用它来使事情变得更紧凑：

$(document).ready(){
    if ( window.location.href == "http://sample.com/" ) {
        $('#only-show-when-index').show();
    } else {
        $('#only-show-when-index').hide();
    }
};

我还想指出，由于您使用的是 WordPress，而且如果不刷新，这将永远不会改变，您可以在添加的代码周围使用一些 PHP 来完成同样的事情：

<?php if ( is_front_page() ): ?>
    <!-- shown only on front page -->
<?php else: ?>
    <!-- shown everywhere else -->
<?php endif; ?>

这样您就不会依赖用户的浏览器来显示/隐藏您的代码。