Google Maps + XHTML1.1

As described in another post tonight I wanted XHTML1.1 compliance in my content management system. There was also a need for a map based location. Google Maps mashup time… Only one problem, XHTML1.1 compliance means using the application/xhtml+xml mime type. Google Maps uses the JavaScript function document.write(), and wouldn’t you know it, that function does not exist in the xml dom api.

Seems I’m not the only one with this issue: Google Maps API – No XHTML Support. I couldn’t actually find any such references on the Google Maps Help Group, I didn’t look to hard though. Why? Because I found lots of information in other areas. If you follow some links from the following you will have more than enough information.

• John Resig discusses the issue and presents a solution. AdSense related.
• Thread on Google Maps API Group.

I tried the solution presented by John Resig. No dice. I think this may be related to the differences in AdSense and Google Maps.

The CMS already used jQuery extensively, so perhaps jQuery could help. It’s funny this is extremely simple, but it works:
<script type="text/javascript" src="/js/jquery.js"></script>
<script type="text/javascript">
//<![CDATA[
// Especially overwritten for xhtml+xml content type
document.write = function(str) { $("head").append(str); };
//]]>
</script>


Ok, claiming that works is silly:

• It works in Firefox, IE6+, Opera* and Konqueror.
• I have not tested it in Safari, it did work with Konqueror though.
• It depends on the jQuery library (it might work with Prototype).
• * You have to serve text/html to Opera. It appears Opera doesn’t support executing JavaScript added in this fashion, be it external files or inline code.

If anyone can test under Safari that would be excellent.

Andrew