I have a ReferenceError: document is not defined

Viewed 38

My code is showing a reference error I don't know why, I'm using node js in webstorm ide.

My HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" href="style.css">
    <meta charset="UTF-8">
    <title>Title</title>

</head>
<body>
    <main class="container">
        <h1 id="main-heading"> Movies </h1>
        <div class="movie-list">
            <ul>
                <li class="list-items"> Thor </li>
                <li class="list-items"> Batman </li>
            </ul>
        </div>
    </main>
    <script type="application/javascript" src="script.js"></script>
</body>
</html>

My Script

const title = document.getElementById('main-heading');
console.log(title);

Error

const title = document.getElementById('main-heading');
              ^

ReferenceError: document is not defined
1 Answers

The type application/javascript is obsolete, you can use either text/javascript or application/x-javascript.

application/x-javascript this is experimental condition better to use the text/javascript

It will also work without the type, simply:

<script src="script.js"></script> 
Related