13

I work for a company that writes software which client sites embed with < script language="JavaScript" src=..... etc. etc. We depend quite a bit on document.write to write elements out to the page. One of our clients for some reason has opted to use the content-type "application/xhtml+xml", which makes document.write() unusable in chrome.

I understand why this is, and that DOM-compliant code should create each element, set its attributes, fill it with a text node if needed, attach the text node to its parent and the parent to some page element....

but what's a good workaround that doesn't require all this junk? The write()s therein have so many elements that the resulting code would be hideous if we made nodes and fastened them together like Knex or Legos or what-have-you.

edit: Tried using CDATA, but even this line is condemned similarly by the xhtml parser on the same page as our script embed:

<script language="text/javascript"><![CDATA[document.write('hi');]]></script>
1
  • 1
    At first glance, JSONML — jsonml.org — looks like it does what you want, but since I've just Googled it up and haven't spent too long looking at it, I'm not confident enough to call this an answer.
    – Quentin
    Commented Sep 1, 2010 at 16:59

3 Answers 3

11
var el = document.createElement('div');
el.innerHTML = 'What you used to document.write()';
document.body.appendChild(el);

Note that you'll need to fix the HTML to be valid XHTML, but that should be much less work than converting all the code to use DOM manipulation.

3
  • It does it the html is valid xhtml. The code above is adapted from production code, and you'll find jQuery uses a similar technique for building fragments. Test page: pastebin.com/4akXVkv3 Commented Sep 29, 2010 at 14:15
  • Okay, looks like it is implemented for all modern browsers and is part of HTML5. I'd bump up your answer but I'm locked unless you edit it.
    – Sean Hogan
    Commented Sep 30, 2010 at 12:20
  • Done, with a caveat added about the content needing to be valid xhtml. Commented Sep 30, 2010 at 14:53
2

Perhaps you can create an iframe of type text/html, write the content into that, and then import the nodes back into the main page.

2
  • +1 for a very creative idea, even though the accepted answer is probably simpler.
    – Tyler
    Commented Feb 18, 2011 at 0:43
  • URL changed in frame will not show in browser, so the user can't add a specific page to bookmark
    – cwtuan
    Commented Jun 1, 2017 at 5:44
0

We've been using Jquery and set timeouts to rewrite code supplied to us by similar organisations to yours. Here's an example from Search Ignite:

<script>
<!--
// once all the page has loaded
$(document).ready(function ()
    {
        // wait a bit so everything else that runs when the page has loaded loads, then...
        setTimeout(function ()
        {
            // ...load the tracking stuff
            var headerTag = document.getElementsByTagName('head')[0];
            var seo_tag = $.createElement(document.location.protocol + "//track.searchignite.com/si/CM/Tracking/ClickTracking.aspx?siclientid=123456&jscript=1", "script");
            headerTag.appendChild(seo_tag);

        }, 20);
    });
// -->
</script>

The timeout has the added benefit of making our page responsive to the user before the the external code has been loaded by the users browser, very useful if the external supplier's servers ever go down. Yes we loose some tracking stats but the user experience is not compromised.

Obviously you won't be able to rely on JQuery but you get the general idea.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.