Skip to content

Using iUI with XHTML

I’m creating an iPhone web application, using the iUI framework to give it a look and feel similar to native iPhone apps.

I came across the need to use SVG drawings; since iUI uses a single page for navigation I had to use XHTML (served as XML) to get the SVG code inline. A couple of errors occurred, due to XHTML not supporting the innerHTML Node property.

The first two fixes were easy, just replace innerHTML with textContent and that was that. But the third fix, where innerHTML is used to swap pages, was more complicated. Here’s what I started with:

var frag = document.createElement('div');
frag.innerHTML = xhr.responseText;

A pretty typical use of AJAX, and here’s how it works in XHTML:

try {
    var frag = document.createElement('div');
    frag.innerHTML = xhr.responseText;
}
catch (e) {
    var parser = new DOMParser();
    var frag = parser.parseFromString('<div xmlns="http://www.w3.org/1999/xhtml">' + xhr.responseText + '</div>', 'application/xhtml+xml');
    frag = frag.documentElement;
}

Once I got that working, I was still getting an error message in Safari’s console:

WRONG_DOCUMENT_ERR: DOM Exception 4: A Node was used in a different document than the one that created it (that doesn't support it).

Turns out I had some plain <br> elements in the response; putting the proper closing slash at the end fixed that right up.

2 thoughts on “Using iUI with XHTML

  1. Thank you for sharing superb informations. Your web-site is very cool. I am impressed by the details that you?¬¶ve on this site. It reveals how nicely you perceive this subject. Bookmarked this website page, will come back for more articles. You, my friend, ROCK! I found just the info I already searched all over the place and simply couldn’t come across. What an ideal web-site.

  2. As I web site possessor I believe the content material here is rattling wonderful , appreciate it for your hard work. You should keep it up forever! Good Luck.

Comments are closed.