El mejor lugar para insertar JavaScript en un documento HTML [duplicado]

Posible duplicado:
¿Dónde está el mejor lugar para poner? tags in HTML markup?

Where should I put javascript code?

  <-- Here?
  <-- Here?
  <-- Here?

I've always used above </body> just wanted to know if this was "the best"

preguntado el 30 de enero de 12 a las 19:01

What are you trying to optimize for? -

big question. answer is "it depends" -

Not trying to optimize per say, just wondering where it would be best for, or does it not matter? -

Officially, it goes in the <head> block. Unofficially, you can stuff it wherever you want. -

Creo que el Here is the best place -

8 Respuestas

If the JavaScript needs to be ready to go before the entire page loads, you put it between <head></head>. If the JavaScript needs to be available right before the user encounters something on the page, you can put it prior to the element in the <body></body> (although people hardly do that for code readability). If the JavaScript just does some enhancements or provides tracking information (it's not a necessity), you can put it right before </body>.

Respondido el 31 de enero de 12 a las 00:01

Concensus seems to be that there are two sensible places to put scripts:

  1. En los <head> sección:

    • Pro: Scripts are loaded before content, so dynamic behaviors can be applied before the user can interact with the page.
    • Con: users have to wait while scripts are downloaded and applied, which can lead to higher bounce rates and generally poorer performance.
  2. Sólo antes de los </body> tag:

    • Pro: content is loaded and visible to the user as soon as possible.
    • Con: dynamic behaviours, effects, etc, are not immediately applied.

You need to decide what your priorities are and what your specific needs are. Personally, I'll put anything absolutely critical to the proper functioning of the page in <head> and anything that is progressive enhancement at the end.

Respondido el 31 de enero de 12 a las 00:01

Really depends on what you are trying to do.

General rule of thumb would have you put your javaScript code in a seperate file and link that script with something like this

<script type="text/javascript" src="your/source/here.js"></script>

Then again, having your script inline within the page, you can have it where you want. Within the headsection of the page, it loads beforehand, and therefore can pre-process if needed. If you have it let's say during the body portion of the page, it will load with the normal flow of the page.

Having everything on the same file, I would have the script in the head and, if needed, call functions afterwards in the body.

Espero que esto ayude.


Keep in mind that the main goal should be readability and re-usability of your code. Therefore, whatever makes this happen in the most efficient way, I would have to say is the best way.

Respondido el 20 de junio de 20 a las 12:06

Poniendo <script> después de </body> or </html> would be invalid, and I'm not sure what it would accomplish. Some scripts, for analytics services for example, are recommended to be loaded at the end of body (just before </body>) because they load synchronously and may hang the page.

Respondido el 31 de enero de 12 a las 00:01

Don't think it's nearly as much about where in the code, it's how you handle checking if you can run code when it triggers. i.e. onload or onready.

HTML5 boilerplate promotes having most if not all scripts as the last elements in the body, but I have yet to ever find time to benchmark this vs having it in the head.

Respondido el 31 de enero de 12 a las 00:01

JavaScript can be added anywhere. Just a basic example below as you are learning things.

----- Your Javascript here -----

Respondido el 31 de enero de 12 a las 00:01

Inside </html> Inside <body>

That said, from there it's sometimes just preference. Many say at the end of the doc because there's a supposed speed increase. If it's there, it's minuscule.

Respondido el 31 de enero de 12 a las 00:01

Its better if you put javascript code inside <head> // javascript code here </head> because head section loads before your page appears.

Respondido el 31 de enero de 12 a las 00:01

You say it's better. I say it depends. I personally don't like to let the user wait for the javascript to load (when it isn't needed). - PeeHaa

...and without a dom listener, you've just fired Javascript on elements that aren't yet rendered in legacy versions of the evil browser (IE) - bpeterson76

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.