Welcome to WebmasterWorld Guest from 54.242.63.214

Forum Moderators: open

Message Too Old, No Replies

Using JS to *change* the doctype

     

rh2600

12:08 pm on Jan 13, 2006 (gmt 0)

5+ Year Member



Is this possible?

I would like some javascript/bookmarklet to be able to toggle quirksmode on and off. But I am thinking JS doesn't have access to the doctype element of a document?

Cheers,

Ross

Rambo Tribble

1:48 pm on Jan 13, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



JS has access to the doctype property of the document object, but it is read only. I don't think IE Win supports even this, though.

Using document.write() you should be able to create a new document with the doctype declaration of your choice, but of course, document.write() is not permitted in XHTML.

DrDoc

7:13 pm on Jan 13, 2006 (gmt 0)

WebmasterWorld Senior Member drdoc is a WebmasterWorld Top Contributor of All Time 10+ Year Member



doctype = "";
headStuff = "<head></head>";
function quirksOn() {
document.write("<html>" + headStuff + "<body>" + body.innerHTML + "</body></html>");
}
function quirksOff() {
document.write(doctype + "<html>" + headStuff + "<body>" + body.innerHTML + "</body></html>");
}

Bernard Marx

7:28 pm on Jan 13, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



That looks painful!

Rambo Tribble

11:44 pm on Jan 13, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Some might be tempted to characterize client-side doctype manipulation as an unnatural act. Sort of a Frankensteinish creation in pursuit of the usurpation of the server's perogative.

But, being semantic-web agnostic, I don't really care.

rh2600

2:57 am on Jan 14, 2006 (gmt 0)

5+ Year Member



Hehe yup that would work, but I really need it to modify an existing HTML document, the one that the JS is included in.

Basically I am looking for a bookmarklet to turn quirksmode on/off so I can test to see if my site will look wrong in a quirky browser (IE 5/5.5) in a multimode browser such as FF.

It's not really looking possible :)

DrDoc

5:10 am on Jan 17, 2006 (gmt 0)

WebmasterWorld Senior Member drdoc is a WebmasterWorld Top Contributor of All Time 10+ Year Member



Interesting things can happen ...
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html>
<head>
<title>Untitled</title>
</head>
<body>
<script type="text/javascript">
function foo() {
alert("document.body.parentNode.previousSibling.tagName\n" + document.body.parentNode.previousSibling.tagName);
alert("document.body.parentNode.parentNode.firstChild.tagName\n" + document.body.parentNode.parentNode.firstChild.tagName);
alert("document.body.parentNode.parentNode.firstChild.nodeName\n" + document.body.parentNode.parentNode.firstChild.nodeName);
alert("document.body.parentNode.parentNode.firstChild.nodeValue\n" + document.body.parentNode.parentNode.firstChild.nodeValue);
alert("document.body.parentNode.parentNode.lastChild.tagName\n" + document.body.parentNode.parentNode.lastChild.tagName);
alert("document.body.parentNode.parentNode.lastChild.nodeName\n" + document.body.parentNode.parentNode.lastChild.nodeName);
}
function redoctypeme(which) {
alert("before\n" + document.body.parentNode.parentNode.firstChild.nodeValue);
if(which == 1) {
document.body.parentNode.parentNode.firstChild.nodeValue = "DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01//EN\" \"http://www.w3.org/TR/html4/strict.dtd\"";
}
else {
document.body.parentNode.parentNode.firstChild.nodeValue = "DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\"";
}
alert("after\n" + document.body.parentNode.parentNode.firstChild.nodeValue);
foobar = document.body.innerHTML;
alert("empty");
document.body.innerHTML = "";
alert("reset");
document.body.innerHTML = foobar;
}
</script>
<a href="javascript: foo()">stuff</a>
<a href="javascript: redoctypeme('1')">doctype 1</a>
<a href="javascript: redoctypeme('2')">doctype 2</a>
<hr>
<div style="background: #0c0; width: 200px; color: #fff;">200px</div>
<div style="background: #c00; width: 200px; padding: 20px; border: 30px solid #00c;">&nbsp;</div>
<div style="background: #0c0; width: 300px; color: #fff;">300px</div>
</body>
</html>

DrDoc

5:12 am on Jan 17, 2006 (gmt 0)

WebmasterWorld Senior Member drdoc is a WebmasterWorld Top Contributor of All Time 10+ Year Member



so I can test to see if my site will look wrong in a quirky browser (IE 5/5.5) in a multimode browser such as FF

...not that quirksmode in FF is going to be anything like quirksmode in IE.
Get IE 5/5.5/6 on your machine instead.

JAB Creations

3:59 pm on Jan 17, 2006 (gmt 0)

WebmasterWorld Senior Member jab_creations is a WebmasterWorld Top Contributor of All Time 10+ Year Member



I would not recommend changing the doctype via JavaScript. This really should be done via a serverside language such as ASP, CF, Perl, or PHP in example.

To change QuirksMode (which I assume you're attempting to do for IE) all you need to do is put an (X)HTML comment before the doctype. This will force IE in to quirks mode and all other browsers should still remain in standards mode (assuming you of course have a doctype).

Hope this helps...

John

 

Featured Threads

Hot Threads This Week

Hot Threads This Month