Fail to execute JavaScript from HTML file - document not defined

Question

I can't succeed in calling JavaScript file from a HTML file.

test.html:

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
    <script  src='http://code.jquery.com/jquery-3.2.1.min.js'</script> 
    <script type='text/javascript' src='test.js' </script>
    <script>theTest(); </script>
</head>
<body>
    <div id="myTest" style="position:relative;width:600px;height:400px;"></div>
</body>
</html>

test.js:

function theTest()
{
    var they = 2;
    console.log(they);
    alert(they);
};

document.getElementById('myTest').innerHTML;

I am receiving:

ReferenceError: document is not defined

Is the missing > in your jQuery <script> tag a typo here, or in your original code? — freginold
– freginold, Commented Sep 11, 2017 at 13:48
^ Better yet, of the three <script> tags, only one is properly closed. — Tyler Roper
– Tyler Roper, Commented Sep 11, 2017 at 13:49

freginold · Accepted Answer · 2017-09-11 13:59:14Z

0

You are calling theTest(); before the browser is generating the #myTest element, or even starting to build the page, so the function has nothing to act on. Move your third script tag down to the end of your body element, and it should work fine. See this example:

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
    <script src='http://code.jquery.com/jquery-3.2.1.min.js'></script> 
    <script type='text/javascript' src='test.js'></script>
</head>
<body>
    <div id="myTest" style="position:relative;width:600px;height:400px;"></div>
    <script>
        theTest();
    </script>
</body>
</html>

answered Sep 11, 2017 at 13:59

freginold

3,9603 gold badges16 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

14 Comments

George Over a year ago

H, thanks but I am still getting the error about document not found.Let me remind you that I want to call the javascript file which executes the html file and not the opposite.

Junius L Over a year ago

But the function is not calling any page element.

freginold Over a year ago

@George Where are you loading the HTML file from your JavaScript file?

Tyler Roper Over a year ago

@George That line of code does literally nothing. You're getting the HTML content of the myTest element, but you're not saving it, changing it, doing anything with it, etc. For example, document.getElementById('myTest').innerHTML = "Hello world!" would set the HTML. var myHtml = document.getElementById('myTest').innerHTML; would store it as a variable. But that line on it's own has no purpose.

George Over a year ago

@freginold:node test.js

|

Collectives™ on Stack Overflow

Fail to execute JavaScript from HTML file - document not defined

1 Answer 1

14 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

14 Comments

Linked

Related