JavaScript使用hashtag更改显示

我对JS很陌生，对一些看起来很简单的东西有问题。 我正在尝试编写一个代码，这样，如果页面加载时url末尾有一个#，例如www.example.com#hashtag，那么将显示一个div，如果没有#，则不会显示该div

我的代码：

JS:

if（window.location.hash）{
document.getElementById（“displaydiv”）.style.display=“block”；
}

HTML:

这将获得散列（#displayDiv）并显示特定的div

<script type="text/javascript">
  var hasher = window.location.hash;

  if(hasher.indexOf('displaydiv') > -1) {
    document.getElementById("displaydiv").style.display = "block"; 
  } else if (hasher.indexOf('anotherDiv') > -1) {
    document.getElementById("anotherDiv").style.display = "block";
  }
</script>

<div id="displaydiv" style="display: none; height: 100px; width: 100px; background-color: red;"></div>

var hasher=window.location.hash；
if（hasher.indexOf（'displaydiv'）>-1）{
document.getElementById（“displaydiv”）.style.display=“block”；
}else if（hasher.indexOf（'anotherDiv'）>-1）{
document.getElementById（“anotherDiv”）.style.display=“block”；
}

使用选择器的简单CSS解决方案如何：

*:target {
  display: block;
}

---

代码是正确的，但是

在呈现

之前执行得太早，因此我怀疑您在浏览器中遇到了JavaScript错误。你检查过浏览器控制台了吗

将

移到

之后将修复它，但最好将代码放入函数中，并在页面加载后调用它，例如：

<script type="text/javascript">
    function init() {
        if (window.location.hash) {
            document.getElementById("displaydiv").style.display = "block"; 
        }
    }

    window.onload = init;
</script>

函数init（）{
if（window.location.hash）{
document.getElementById（“displaydiv”）.style.display=“block”；
}
}
window.onload=init；

---

请参见

将您的示例简化为JS，以便更容易帮助您。不要浪费读者的时间说您是JS新手，请坚持解决问题。

*:target {
  display: block;
}

<script type="text/javascript">
    function init() {
        if (window.location.hash) {
            document.getElementById("displaydiv").style.display = "block"; 
        }
    }

    window.onload = init;
</script>