3 ms·

I never really thought about it much, but there's no reason it needs to. There is not really any ambiguity that the head tag solves ever. Script tags don't act

I never really thought about it much, but there's no reason it needs to. There is not really any ambiguity that the head tag solves ever. Script tags don't act differently in or out of the head tag, and things like <title> are always going to do the same thing, so having the <head> block is at best a "comment" to the user that these elements are "head related".

Sidnicious 10y ago
One difference: when a script executes in the <head>, the <body> doesn't exist yet — document.body is null. A <script src="…" defer> always runs with a body, which is nice in any case since it keeps scripts together, lets the browser start loading every script right away, and is explicit about which ones need to run before the body. Sadly, defer is only allowed for script elements with a src attribute.
- tedmiston 10y ago
  I've been sleeping on best practices here... is it preferred to do a script with defer in the <head> over putting it at the bottom of the <body> now?
  - angry-hacker 10y ago
    Doesn't matter much with defer or async. If you but the at the bottom, they start loading in parallel slightly later.
    - ec109685 10y ago
      Which could be a good thing or bad thing depending on its importance to the experience.
  - Sidnicious 10y ago
    I'd say yes. Defer-in-<head> works just like bottom-of-<body>, except the browser can start downloading and parsing the scripts right away (and in parallel if it wants).
- Jasper_ 10y ago
  That's just because of ordering, though. Test it: <html> <body></body> <head><script>alert(document.body);</script></head> </html> works fine. It's not a head vs. body distinction, it's just that the parser is stopped during inline scripts, and doing e.g. getElementById won't work if the script is declared after you. This is why window.onload and then jQuery's document.ready, and later, putting the script at the end of your file, is a best practice.
  - Sidnicious 10y ago
    What's happening isn't what you think is happening. The parser creates an empty head element when it sees the <body> start tag, the second <head> start tag is ignored, and the <script> is treated as part of the body element. Try changing the body of the <script> tag to this: alert(document.currentScript.parentNode); It alerts "[object HTMLBodyElement]". The behavior is specced out here, if you're curious: https://www.w3.org/TR/html5/syntax.html#parsing-main-afterbody https://www.w3.org/TR/html5/syntax.html#parsing-main-afterbo...
z3t4 10y ago
Put the meta stuff in the header, like styling, alternate languages and stuff that are not content. Things that conserns the compiler.

Sidnicious 10y ago

One difference: when a script executes in the <head>, the <body> doesn't exist yet — document.body is null. A <script src="…" defer> always runs with a body, which is nice in any case since it keeps scripts together, lets the browser start loading every script right away, and is explicit about which ones need to run before the body. Sadly, defer is only allowed for script elements with a src attribute.

tedmiston 10y ago
I've been sleeping on best practices here... is it preferred to do a script with defer in the <head> over putting it at the bottom of the <body> now?
- angry-hacker 10y ago
  Doesn't matter much with defer or async. If you but the at the bottom, they start loading in parallel slightly later.
  - ec109685 10y ago
    Which could be a good thing or bad thing depending on its importance to the experience.
- Sidnicious 10y ago
  I'd say yes. Defer-in-<head> works just like bottom-of-<body>, except the browser can start downloading and parsing the scripts right away (and in parallel if it wants).
Jasper_ 10y ago
That's just because of ordering, though. Test it: <html> <body></body> <head><script>alert(document.body);</script></head> </html> works fine. It's not a head vs. body distinction, it's just that the parser is stopped during inline scripts, and doing e.g. getElementById won't work if the script is declared after you. This is why window.onload and then jQuery's document.ready, and later, putting the script at the end of your file, is a best practice.
- Sidnicious 10y ago
  What's happening isn't what you think is happening. The parser creates an empty head element when it sees the <body> start tag, the second <head> start tag is ignored, and the <script> is treated as part of the body element. Try changing the body of the <script> tag to this: alert(document.currentScript.parentNode); It alerts "[object HTMLBodyElement]". The behavior is specced out here, if you're curious: https://www.w3.org/TR/html5/syntax.html#parsing-main-afterbody https://www.w3.org/TR/html5/syntax.html#parsing-main-afterbo...

z3t4 10y ago

Put the meta stuff in the header, like styling, alternate languages and stuff that are not content. Things that conserns the compiler.