0

Hi I'm experiencing some problems including a javascript file in my html project. When I include it like this at the end right before the body tag my site does not work correctly.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
    </body>

If, however i delete the tag at the end to make it look like this

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"/>
</body>

everything works fine.

And if i include it within the head, it also works, independent of the syntax. Why does it behave like this?

TheBaj
  • 1,091
  • 1
  • 10
  • 22
  • With which browsers are you experiencing this issue? – Lee Taylor Oct 28 '12 at 21:16
  • 1
    The script tag isn't meant to be self-closing. That will cause issues in IE. – ScottE Oct 28 '12 at 21:17
  • So far i have only tried it with google chrome. what does self closing mean? something like the second example? – TheBaj Oct 28 '12 at 21:19
  • I don't think this would be the problem, but are you using any jQuery code before the library is included? – Ian Oct 28 '12 at 21:19
  • Self closing means there is no closing tag, it is closed within itself - by putting the `/` at the end – Ian Oct 28 '12 at 21:20
  • yes i am using some jquery code at the end of the head tag. i wanted to put the inclusions to the end of the body tag because i heard that that was supposed to make the document load faster. but i guess i have to include the files before i use any jQuery code?? – TheBaj Oct 28 '12 at 21:21
  • FWIW, you can use `src="//ajax.googleapis.com/..."` and redact the protocol to avoid any kind of secure/insecure warning message. The script will then use the native protocol to retrieve the file. – Brad Christie Oct 28 '12 at 21:26

4 Answers4

1

For browser compatibility, you must use the first form:

<script src="https://..."></script>

with an explicit closing tag </script>. If this is the case where your code is not working, then your real problem lies elsewhere and not in the way you close the tag.

Greg Hewgill
  • 951,095
  • 183
  • 1,149
  • 1,285
  • Indeed. Chances are another tag (residing elsewhere in the document) remains unclosed and is setting the parser off due to malformed HTML. I recommend using an [HTML validator](http://validator.w3.org/) to get further insight. – Brad Christie Oct 28 '12 at 21:24
  • thank you..i guess this is just what i was looking for. it's kinda hard doing debugging when there aren't any error messages or anything. – TheBaj Oct 28 '12 at 21:29
1
  1. Do what everybody else has said, regarding the <script src="..."></script>
  2. Use just src="//...", instead of src="https://..." or on non-encrypted pages (http vs https) your visitors will get security warnings for mixing the two protocols
  3. If you have written jQuery code anywhere on the page, prior to actually including the file, you're going to get reference errors, where JS will not be able to find the function ($) you're trying to use.

There is a debugger available if you use Chrome, and press CTRL+SHIFT+J : it will take you to the developer-console, where I'm sure you're going to see all kinds of reference errors.

In Firefox, it would be CTRL+SHIFT+K, in IE it's F12.

This works under the same premise as writing in other languages where you try to use libraries or other classes, but don't actually import them until the bottom of your program.

Norguard
  • 26,167
  • 5
  • 41
  • 49
0

There might be some race condition happening for you... it will be good if you can provide complete code... if you attach that in header ... then your jquery is successfully loades and then executes your body part... if your attaching that in body ... then closure of script is give some issues... try to play while changing your script code placements in you body tag.

</script> closing is compulsory to work in cross browsers

This might help you in ur debugging.

Satish Bellapu
  • 740
  • 1
  • 5
  • 15
0

Why do you want to load jquery in the end of your code? If you have some other scripts that need jquery, then they should be loaded after it. So either you put all script tags in head or in the end of body — jquery should be loaded before other files that depend on it.

Andrey Kuzmin
  • 4,479
  • 2
  • 23
  • 28