我正在尝试通过if else语句来显示一个div或另一个基于url的语句,但它根本无法正常工作,只有一个div持续显示:
Div 1是唯一不断显示的内容,我已经尝试了许多变通方法:
<script>
if (window.location.href.indexOf("pink") > -1)
{
document.getElementById("div2").style.display="none";
}
else {
document.getElementById("div1").style.display="none";
}
</script>
<div id= "div2">
<a id="link2" href="https://example2" target="_top"></a>
</div>
<div id= "div1">
<a id="link1" href="https://example1" target="_top"></a>
</div>
<style>
#link2
{
background: url(http://examplemy.com/wp-content/backtwo.PNG);
background-repeat: no-repeat;
background-size:cover;
}
#link1
{
background: url(http://examplemy.com/wp-content/backone.PNG);
background-repeat: no-repeat;
background-size:cover;
}
html, body {width: 100%; height: 100%; margin: 0;}
我现在将脚本放在最后,但仍然无法正常工作。
另外,将我的站点usr作为examplemy / pink
答案 0 :(得分:0)
该脚本在加载div之前正在运行。它无法找到它们;如果在加载此页面时将其打开,则可能会在开发控制台中看到错误。您应该将脚本移到div下方,或将代码放入窗口(window.addEventListener('load', function() { ... })
)的加载事件的事件处理程序中,以使其在div加载之前不会运行。 (在这种情况下,您也可以使用DOMContentLoaded事件而不是普通加载事件,尽管这种情况鲜为人知。)