Bug Tracker

Opened 10 years ago

Closed 8 years ago

Last modified 8 years ago

#4850 closed enhancement (patchwelcome)

Patch for SVG DOMs

Reported by: kbwood Owned by:
Priority: low Milestone:
Component: core Version: 1.4.4
Keywords: SVG DOM xml Cc:
Blocked by: Blocking: #7584

Description

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.

Attachments (1)

jquery-1.3.2-svg.patch (4.3 KB) - added by kbwood 10 years ago.
Patch for jQuery 1.3.2 to work with SVG DOMs

Download all attachments as: .zip

Change History (8)

Changed 10 years ago by kbwood

Attachment: jquery-1.3.2-svg.patch added

Patch for jQuery 1.3.2 to work with SVG DOMs

comment:1 Changed 10 years ago by rybesh

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

comment:2 Changed 9 years ago by snover

Keywords: xml added
Milestone: 1.4
Priority: majorlow
Version: 1.3.21.4.4

comment:3 Changed 9 years ago by snover

Blocking: 7584 added

comment:3 Changed 9 years ago by snover

Blocking: 7584 removed
Status: newopen

comment:4 Changed 9 years ago by snover

Blocking: 7584 added

comment:5 Changed 9 years ago by 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/

comment:6 Changed 8 years ago by john

Resolution: patchwelcome
Status: openclosed

See thoughts in #7584.

Note: See TracTickets for help on using tickets.