0

My html code

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">

 <link rel="stylesheet" href="style.css">
 <script src = "app.js"></script>

 <title>The Chat App</title>
</head>
<body>
 <div id="headingWrapper">
     <h1 id = "heading">WELCOME TO THE CHAT APP,<br> WHERE YOU CAN CHAT ONLINE!  </h1>

 </div>


</body>
</html>

Vanilla js code

window.onload = function(){const heading = document.getElementById("heading")};
console.log(heading.value);

This code causes this error: app.js:6 Uncaught ReferenceError: heading is not defined at app.js:6

Any help would be much appreciated.

Rohan S
  • 45
  • 1
  • 7
  • 2
    Try moving your `console.log` line **inside** your `onload` event handler. Outside of that function, `heading` is not defined – Phil Jul 08 '20 at 01:21
  • Well I used the onload to declare my get element variables in other projects, and that worked fine, even when referencing those variables later. It seems to be a different issue. I do appreciate the help though. – Rohan S Jul 08 '20 at 01:36

0 Answers0