For reasons previously discussed, serving your site up as
application/xhtml+xml is a good thing to do. Check that post for all the reasons why.
“But but!” you cry. “I used the latest version of jQuery, just like you taught me! And I didn’t use anything but jQuery methods!” Well that’s great, but even jQuery can only do so much. Some of its methods rely on the unsupported
innerHTML. So here’s how you fix the issues. Hey, it could be worse; you could have been using
html() & html(val)
These methods rely on
innerHTML. Consider using
text() instead to only replace the text inside elements. If you were using
html() to copy an element’s contents, try
clone(). Finally, if you used
html() because you really wanted all the elements inside, use
children(). The key is to think of an element’s contents as nodes along the DOM tree, rather than a bunch of tag soup. Is there an
<img /> inside your element? Don’t try to copy the HTML somewhere else. Just think, “Hey, I have an image element there. I can query for its src value, which is the important part. Then, I can recreate that image anywhere I want.” Elements are always replaceable– you need only give them back their attributes.
This is a slightly lesser-used aspect of jQuery. It’s used to inject raw HTML into the DOM. See a problem? Yep, XHTML+XML doesn’t do raw HTML. Everything is elements! Fortunately, it’s easy to fix this in your code. Instead of
$("<img src='muu.png' />"), try using
$(document.createElement("img")).attr("src","muu.png"); Not too hard, right?