Making an SVG DOM JavaScript class

I'm unsatisfied with other JavaScript libraries and frameworks like jQuery, MooTools, and Raphael, because of their inability to support SVG grouping. You'd think it'd be a very simple thing for them to implement.

Anyway, I'm trying to make a JavaScript class (using John Resig's class.js script) like this:

var El = Class.extend({
    el: null,
    svgNS: "http://www.w3.org/2000/svg",

    init: function (type) {
        this.el = document.createElementNS(this.svgNS, type);
    },

    set: function (name, attr) {
        this.el.setAttributeNS(null, name, attr);
    },

    get: function (el, name) {
        var attr = this.el.getAttributeNS(null, name);
        return attr;
    },

    add: function (targEl) {
        targEl.el.appendChild(this.el);
    },

    remove: function (targEl) {
        targEl.el.removeChild(this.el);
    },

    setEl: function (docId) {
        this.el = document.getElementById(docId);
    }
});

I can add elements to the DOM using these statements outside of the class, but storing the element inside the class becomes problematic. Anyone have any creative ideas?

ansaurus

tags:

views:

answers:

Making an SVG DOM JavaScript class

related questions