Need help with: jquery prepend doctype to html

StackOverflow https://stackoverflow.com/questions/4493845

  •  12-10-2019
  •  | 
  •  

Question

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 ")

Was it helpful?

Solution

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?

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top