4

Here's my situation:

  1. I am editing an application's CSS style sheet.
  2. I can ONLY edit the CSS style sheet (unless I can creatively glom onto another file using the CSS, or possibly add a small jQuery prepend statement in an existing .js)
  3. Application is ONLY ie6, ie7 and ie8 compliant. They never use FireFox, and it's not an option.

Looking for help with:

1) I think I need to use jQuery to "prepend/prependTo" a "doctype " on to

html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"

Without the !doctype it throws ie8 into quirksmode and of course doesn't accept any styles such as "input[type=checkbox]"

I have not used prepend before. Can you help me with full and correct syntax on how to make the following:

CURRENT: <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

DESIRED: <doctype html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

This has not worked for me yet $("html ").prepend("doctype ")

caroline
  • 421
  • 2
  • 5
  • 12
  • 1
    This *really* needs to be fixed when the page is sent to the client, not in JavaScript – Nick Craver Dec 20 '10 at 21:10
  • I do understand the importance of that, but at this time that is not going to be possible. The application apparently has been running like this for 7 years and they don't have budget to fix or touch certain things. Very unfortunate I know. So if there is a fix that we could patch it up with, I would be ever so grateful for a little help. – caroline Dec 20 '10 at 21:18
  • 2
    IE is *already* in quirksmode by the time this runs...prepending a DOCTYPE after the fact won't reverse that. Also if it *did* work, how many styles would you be breaking? :) – Nick Craver Dec 20 '10 at 21:20

1 Answers1

24

It's not <doctype html>. It's:

<!DOCTYPE html>
<html (xmlns or any other attributes you want)>

<!DOCTYPE is not an element. It has <! at the start, which is invalid for an element. This is the the “doctype declaration”, and it cannot usefully be altered after initial parsing.

Even on browsers whose DOM interfaces let you move/replace the DocumentType node representing the doctype declaration, this does not have the effect of changing between Quirks and Standards mode, which is something that is decided only at initial load time. You cannot mutate a document between modes.

You can load a new document from the existing document but with a changed mode:

<!-- no doctype, loads in Quirks Mode (BackCompat) -->
<html>
    <!-- rest of the document, then at the end: -->

    <script>
        alert('now in compatMode '+document.compatMode);
        if (document.compatMode==='BackCompat') {
            setTimeout(function() {
                var markup= document.documentElement.innerHTML;
                markup= '<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">'+markup+'</html>';
                document.open();
                document.write(markup);
                document.close();
            }, 0);
        }
    </script>
</html>

But I would strongly advise against it. It's ugly, will reset any state and redraw at the end of load time, and has all sorts of negative implications for scripting.

If you want Standards Mode, you really need to be adding the doctype to the HTML itself. If you absolutely can't touch the application, how about using an ISAPI filter (assuming your web server is IIS) to add the doctype to its HTML output?

bobince
  • 528,062
  • 107
  • 651
  • 834
  • 2
    Very clear and concise information. Your answer was both informative and easy to read and understand. You are an invaluable member here at StackOverflow. I am working with the company to add !DOCTYPE to the declaration. It has run without it for over 7 years. Hopefully it can be implemented. I will not add the creative script to add the DOCTYPE. That would be very dangerous with the data being fed to the page, etc. It would require a page refresh and who knows what kind of havoc that would play. Again: Thank You! – caroline Dec 27 '10 at 22:13