Patch for SVG DOMs

[kbwood]

Since the SVG DOM is different to the HTML DOM, several jQuery functions do not work on the former. This patch updates jQuery to work with the SVG DOMs allowing node selection, classname and attribute setting/retrieval, and binding events.

The code has been tested on Firefox 3.0.11, IE 8 with both the Adobe SVG and Renesis viewers, Safari 3.2.2, Opera 9.64, Chrome 2.0.

[kbwood]

Patch for jQuery 1.3.2 to work with SVG DOMs

[rybesh]

It would be awesome if this patch were incorporated, right now selectors fail in weird ways on XHTML+SVG documents.

[mpedrotti]

In the spirit of feature detection, what about a solution like:

value = typeof elem.className === "string" ?
elem.className :
elem.getAttribute("class") ? elem.getAttribute("class") : "";

if (typeof elem.className === "string") {
    elem.className = value;
} else {
    elem.setAttribute("class", value);
}

jQuery 1.5.1 makes only 5 references to className on the left side of assignments and 12 on the right side in the following 6 places:
addClass
removeClass
toggleClass
hasClass
prefilter: CLASS
filter: CLASS

The last one is interesting because, although the code has a conditional expression

elem.className || elem.getAttribute("class")

elem.className returns an object for SVG elements in an XHTML5 document (that is, not just having the HTML5 DOCTYPE, but served as XML or stored on the local disk with .xhtml extension), therefore getAttribute is not called as intended.

If you can rewrite the code in these 6 places so jQuery remains fast enough for ordinary HTML and XHTML, and also supports SVG in XHTML5, it would be one more excellent way to insulate us ordinary Web designers and developers from hassles with the DOM. I would much prefer it to just work than to have the hooks proposed in #4705.

Here are 6 jsFiddles:

Unfortunately this first pair is served as HTML5 instead of XHTML5, which is the real meat of this ticket. ​http://jsfiddle.net/mpedrotti/VTN4y/embedded/result/ ​http://jsfiddle.net/mpedrotti/7JXzx/embedded/result/

XHTML1 Strict for regression testing in older browsers which lack getAttribute and setAttribute (for example, IE6 or IE7) ​http://jsfiddle.net/mpedrotti/PEtBg/embedded/result/ ​http://jsfiddle.net/mpedrotti/qgms6/embedded/result/

HTML4 Transitional for regression testing in older browsers which lack getAttribute and setAttribute (for example, IE6 or IE7) ​http://jsfiddle.net/mpedrotti/RDFrG/embedded/result/ ​http://jsfiddle.net/mpedrotti/xAwY4/embedded/result/

[john]

See thoughts in #7584.