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; ?>

然后，您不会依赖用户的浏览器来显示/隐藏您的代码。

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

2 个答案: