SitePoint Sponsor

User Tag List

Results 1 to 10 of 10

Hybrid View

  1. #1
    SitePoint Zealot
    Join Date
    Jan 2007
    Posts
    130
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    putting script blocks outside of the head tag ok?

    Is it ok to put script tags outside of the head tag? The same question goes for style tags.

    I have done this and it works just fine but i'm wondering if this could bite me later since a book i have about javascript specificly sais i should put those tags in the head of the document.

    I have my reasons for doing this.

  2. #2
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    SCRIPT elements are allowed outside the HEAD element. Whether it is 'OK' depends on whom you ask. Unobtrusive external scripts in the HEAD are usually considered preferable.

    STYLE elements may not occur outside the HEAD, however.
    Birnam wood is come to Dunsinane

  3. #3
    SitePoint Zealot
    Join Date
    Jan 2007
    Posts
    130
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by AutisticCuckoo View Post
    STYLE elements may not occur outside the HEAD, however.
    I assume that you mean style elements within style tags outside of the head?
    It does work. What is the reason not to do it?

    Thanks for the readings siteguru, i will have a look at them.

  4. #4
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by jeanpaul1979 View Post
    I assume that you mean style elements within style tags outside of the head?
    An element consists of a start tag, some content and an end tag. For example:
    HTML Code:
    <style type="text/css">
      html {background:#fff; color:#000}
    </style>
    This element consists of a start tag with an attribute (<style type="text/css">), content (html {background:#fff; color:#000}) and an end tag (</style>).

    Quote Originally Posted by jeanpaul1979 View Post
    It does work. What is the reason not to do it?
    Because it is invalid HTML (or XHTML). The DTD does not allow a STYLE element to occur outside of the HEAD element. There is nothing in the standards that says how a user agent should handle such an occurrence. The fact that some contemporary browsers apply the CSS as if it were specified in the correct place is irrelevant. You never know what the next generation of browsers will do. They may choose to reformat your hard drive if they find a STYLE element within BODY, and that would not be contrary to the specification.

    What is the reason not to spell 'fish' as 'ghoti'? George Bernard Shaw presented a valid argument for that spelling. Could it be because our 'standards' specify the former? Or because there's a risk some readers won't understand the latter?

    If you 'need' to use STYLE elements in the BODY, then your template system is badly broken. I would recommend setting class or id attributes on the elements you want to affect, and put the corresponding styles in an external CSS style sheet referenced from the HEAD.
    Birnam wood is come to Dunsinane

  5. #5
    SitePoint Wizard siteguru's Avatar
    Join Date
    Oct 2002
    Location
    Scotland
    Posts
    3,631
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Script blocks in the BODY of the page will be parsed and executed inline as the document loads (much like those in the HEAD). I think one difference is the blocks in the BODY can interfere with your layout. But the main difference is that blocks in the BODY may not react to events.

    Some reading ...

    http://www.tizag.com/javascriptT/jav...theadnbody.php
    http://www.w3schools.com/js/js_whereto.asp
    Ian Anderson
    www.siteguru.co.uk

  6. #6
    SitePoint Zealot
    Join Date
    Jan 2007
    Posts
    130
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Allright, that's clear now. Thanks for you explanation.

    I am using Code igniter and i have standard headers for groups of pages, i have made it so that i can pass additional head code to the header. So it will be no problem to do so.

    It does mean that the queried css data has to travel from the controller trough the view to the header so the view is a middle man that does nothing to the data exept pass it on.

  7. #7
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by jeanpaul1979 View Post
    It does mean that the queried css data has to travel from the controller trough the view to the header so the view is a middle man that does nothing to the data exept pass it on.
    Yes, that can be rather tedious. It's often possible to separate the actual presentation from the content, though, as I outlined in my previous post. This, of course, requires that the number of styles is finite.

    If the content (model object) can be classified, the view can easily assign the appropriate attribute and the controller doesn't have to know anything at all about this part. With the class styling in an external style sheet you also get the benefit of less bandwidth and better cacheability.

    I've run into similar problems in a Java-based CMS with nested JSP templates, so I feel your pain.
    Birnam wood is come to Dunsinane

  8. #8
    SitePoint Zealot
    Join Date
    Jan 2007
    Posts
    130
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    I don't understand entirely what you are saying
    Quote Originally Posted by AutisticCuckoo View Post
    If the content (model object) can be classified, the view can easily assign the appropriate attribute and the controller doesn't have to know anything at all about this part.
    but i do have the option to include the style elements in an external css file, the main css file. This file has a php extension with a css header(), it also recieves dynamic information.

    Do you know if a php document with a css header will be cached by default like a css document?
    And what the rules are for retrieving a fresh copy of a css document?

    I'm not familiar with caching yet, it is next on my list.

  9. #9
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by jeanpaul1979 View Post
    Do you know if a php document with a css header will be cached by default like a css document?
    It depends on the cache control HTTP headers sent by the server. With PHP, of course, you can control those yourself with the header() function.

    The Caching Tutorial for Web Authors and Webmasters is a good primer which I can recommend.
    Birnam wood is come to Dunsinane

  10. #10
    SitePoint Zealot
    Join Date
    Jan 2007
    Posts
    130
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Allright, thanks man. I appriciate your support.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •