Side navigation
#4850 closed enhancement (patchwelcome)
Opened July 04, 2009 07:43AM UTC
Closed April 17, 2011 12:13AM UTC
Last modified March 13, 2012 07:19PM UTC
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: |
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)
Change History (7)
Changed January 22, 2010 04:08AM UTC by comment:1
Changed November 19, 2010 04:51AM UTC by comment:2
| keywords: | SVG DOM → SVG DOM xml |
|---|---|
| milestone: | 1.4 |
| priority: | major → low |
| version: | 1.3.2 → 1.4.4 |
Changed November 21, 2010 04:48AM UTC by comment:3
| blocking: | → 7584 |
|---|
Changed November 21, 2010 04:48AM UTC by comment:4
| blocking: | 7584 |
|---|---|
| status: | new → open |
Changed November 21, 2010 04:49AM UTC by comment:5
| blocking: | → 7584 |
|---|
Changed March 02, 2011 06:33PM UTC by comment:6
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)
It would be awesome if this patch were incorporated, right now selectors fail in weird ways on XHTML+SVG documents.