Up to this point we haven’t talked about the elephant in the room!
Let’s first assume that we have a basic HTML page like so:
<!DOCTYPE HTML> <html> <head> <title>A Simple HTML Page</title> </head> <body> <h1>My HTML Page</h2> </body> </html>
Note: If you like, you can even click on it and see the contents of the JS file in a new tab
<script> tag with a
src property that points to the file itself.
Here’s what that
script tag would look like:
SUPER IMPORTANT NOTE: When using the
script tag, it is mandatory that you use the closing
</script> tag just as it appears. Don’t try to use the “short-cut” approach like this
It’s usually recommended that you put your
script tags into the
head area of your page like so:
And voila! You’ve now successfully imported the “Debugging_Example.js” file into your simple HTML page.
Pretty simple to understand I hope.
This method is nearly identical to the one above, and thus the same rules from above apply here. You still need to use the proper closing
src property, as you’re not importing the code from an external file, so there’s no purpose to trying to specify the source of the code right?
Here’s what embedding our “debugging example” code would look like:
When to Import and When to Embed
And the answer is also pretty simple.
Oh! And don’t forget, we’re always offering SWEET stuff in the email signup form below. So if you haven’t already, be sure to check out what freebies we’re offering and sign up below.