How to reference script in HTML

#1

If I want to reference a Javascript script in my HTML page, then do I

If I need my HTML page to use some Javascript, do I reference the Javascript script by adding reference to it inside the <head></head> elements and then the <script></script> elements?

Fwiw, I any want the script to apply to this specific HTML page.

Thanks.

#2

I made a quick search in the JavaScript forum. :slightly_smiling_face:

#3

@Erik_J,

I was planning on create a myJavascript.js file and wasn’t sure how to reference that file.

So you are saying that I reference like this?

<head>
  <script>Unsure of the syntax here</script>
</head>

Can you help me with the syntax above?

Is it like a PHP include? Or like a Src link?

#4

If it’s in a separate js file, it would look something like this:

     </div>
     <script src='myjscode.js'></script>
</body>
</html>

at the bottom of your page(s).

2 Likes
#5

So since you use Src, I guess I need to use an absolute path, right?

#6

Could be absolute or relative, as long as it gets you to where the source file is

1 Like
#7

With an href that path must be absolute, right?

#8

Nope.

<a href="../myfolder/index.html">Link</a>

This works just fine.

1 Like
#9

Hmm…

#10

If my HTML/PHP page refers to Javascript code using the <script></script> element, then does that guarantee that that Javascript code will not fire unless the calling HTML/PHP page calls it?

#11

Not sure I understand the question completely.

If you have this in index.html:

     </div>
     <script src='myjscode.js'></script>
</body>
</html>

And this in myjscode.js:

alert("Hello");

Then the moment you load index.html, you will see an alert saying “Hello”.

Is that what you mean?

#12

Yes, but I also mean that if you load “menu.html” it should never be able to call or be affected by myjscode.js

#13

Right. If you don’t include myjscode.js, menu.html won’t be able to call it.

#14

But @Paul_Wilkins wrote some Javascript for me where he put it in a separate file but the calling file didn’t include it…

So my fear is that a Javascript script could sniff out elements in another script that it shouldn’t

#15

I think you’re overthinking things. Just have a play with what you want to do and see what happens.

1 Like
#16

I had this code in “photo-gallery.php” and I wanted a way to stop videos when users clicked the “Close” link…

<div>
    <a class='closeWindow' href='#containerMast_fixed'>Close</a>
</div>

And Paul was nice and wrte a little Javascript code for me and we put it in “/scripts/stopVideo.js”

But “photo-gallery.php” never had reference to it in <script></script

So that makes me worry that a Javscript script I write could be called by other pages when I don’t want that happening!

Since

#17

As far as your JS code being “called by other pages” - yes, by default your .js file is accessible to the internet. So not only can your own pages link to it via the script line, but I could link to it as well, if I wanted. From a security perspective, it should be treated the same way as your html files, that is, it is open for everyone to see.

But if I did include a script line where I included your JS code, what would happen? Well, to continue your example, if my web page happened to have a “Close” link, and was formatted like yours, then there’s a possibility the JS code would stop my videos just like it would stop yours. That usage is not going to affect your own users or web pages, only mine. So in theory you really shouldn’t care or know that I used it.

Yes, you can protect your js pages from me using them if you want.

1 Like
#18

Pardon my dumb questions, but I’m just trying to solve a simple problem - in another thread - and flying blind here.

I actually wasn’t asking but security, but now it looks like I have another thing to worry about! :shifty:

I was concerned that another script of mine might fire off the Javascript unintentionally. So I was wondering if there was a way I can save Javascript code in a file but just make it so a given script (e.g. “photo-gallery.php”) can use it.

Make sense?

#19

Ah.

One way to pretty much guarantee you don’t somehow accidentally fire off that JS code is to literally include the source code in the script section, rather than referencing the code from a separate .js file. If you do that, you’ve limited the scope of that JS code to the one html file where you have the script included.

1 Like
#20

Maybe it would be easier to apply your advice to my actual problem over here…

https://www.sitepoint.com/community/t/enable-img-when-li-target-is-true/346331/4

I am trying to apply a simple example that I found over at MDN, but have LOTS of questions not knowing any Javascript. And what we are talking about in this thread is one of them.

But maybe talking about my larger goal will give you some context to help?