JS没有改变元素风格

Question

我正在使用以下脚本：

if(window.innerHeight > window.innerWidth){
    alert('portrait');
}

上面的脚本运行正常，但如果我将其更改为

 if(window.innerHeight > window.innerWidth){
    alert('portrait');
    document.getElementById("popup").style.display='inline';
    alert('portrait2');
}

在第一次警报后停止工作。我的popup元素看起来像是：

<h1 id="popup" style="display:none">hi</h1>

Answer 1

有一个错误：

Uncaught TypeError: Cannot read property 'style' of null 

JSFiddle

确保<script>

末尾有</body>标记。

或者用window.onload函数包装它：

window.onload = function() {
 if(window.innerHeight > window.innerWidth){
    alert('portrait');
    document.getElementById("popup").style.display='inline';
    alert('portrait2');
  }
}

JSFiddle