Question

我刚刚开始学习JavaScript，但是我对警报有疑问。在Chrome中，警报不会显示HTML，直到执行弹出窗口。

index.html

<!DOCTYPE html>
<html>
<head>
    <title>JavaScript</title>
</head>
<body>
    <h1>JavaScript in HTML</h1>
    <script type="text/javascript" src="script.js"></script>
</body>
</html>

script.js

alert("Helo!");

Answer 1

在发生window事件时，将事件侦听器添加到load对象并在事件处理程序中调用alert：

window.addEventListener('load', function() {
  alert('Helo!');
})

<!DOCTYPE html>
<html>
<head>
  <title>JavaScript</title>
</head>
<body>
  <h1>JavaScript in HTML</h1>
  <script>
    window.addEventListener('load', function () {
      alert('Helo!');
    })
  </script>
</body>
</html>

或将事件监听器添加到document并使用setTimeout并延迟0来延迟DOMContentLoaded事件处理程序中alert的执行：

document.addEventListener('DOMContentLoaded', function() {
  setTimeout(function() {
    alert('Helo!');
  }, 0);
});

<!DOCTYPE html>
<html>
<head>
  <title>JavaScript</title>
</head>
<body>
  <h1>JavaScript in HTML</h1>
  <script>
    document.addEventListener('DOMContentLoaded', function() {
      setTimeout(function() {
        alert('Helo!');
      }, 0);      
    });    
  </script>
</body>
</html>

Answer 2

参考@epascarello的注释，您需要在元素或窗口加载时添加警报。这样的事情。 window.onload = function() {alert('hello');};

Answer 3

此警报阻止了html的加载。加载html后，使用生命周期调用javascript。

<script>
window.onload = function() {
    alert("hello")
};
</script>

此代码的作用是检查浏览器窗口是否已加载。发生这种情况时，您将运行包含脚本的函数。

在Chrome中，警报不会显示HTML，直到执行弹出窗口

3 个答案: