通过jquery替换特定元素中的属性值

时间:2013-05-16 12:27:42

标签: jquery svg jquery-svg

我正在创建svg图表,其中包含许多元素,如矩形,路径,圆,线等。 我通过传递json选项创建元素,以及将要添加的元素引用到代码下面。

 this.svgLink = "http://www.w3.org/2000/svg";


drawPath: function (options, element) {
        var path = document.createElementNS(this.svgLink, "path");
        $(path).attr(options).appendTo(element);

    },

    drawLine: function (options, element) {
        var path = document.createElementNS(this.svgLink, "line");
        $(path).attr(options);
        $(path).appendTo(element);

    },

    drawCircle: function (options, element) {
        var circle = document.createElementNS(this.svgLink, "circle");
        $(circle).attr(options).appendTo(element);
    },
    drawEllipse: function (options, element) {
        var ellipse = document.createElementNS(this.svgLink, "ellipse");
        $(ellipse).attr(options).appendTo(element);
    },

正在传递以下代码之类的选项。

var rectOptions = {
            'id': this.svgObject.id +'_ZoomArea', 'x': x, 'y': y, 'width': width, 'height': height,
            'fill': 'rgba(69,114,167,0.25)', 'stroke-width': 1, 'stroke':'rgba(69,114,167,0.25)','clip-path': 'url(#' + this.svgObject.id +'_ChartAreaClipRect)'
        };

现在我想为已经创建的特定元素传递一些其他选项而不是再次创建只想用新值替换属性值,就像jquery中的$ .extend一样。

如何用新值替换属性值?

谢谢,

希瓦

1 个答案:

答案 0 :(得分:1)

您可以使用$(e).attr(rectOptions)用新的属性覆盖现有属性。

但有一件事让我担心:你真的不应该改变id选项。这可能会混淆已保存旧ID以更新元素的代码。

相反,您可能想要使用此代码:

var id = '#' + this.svgObject.id +'_ZoomArea';
var rectOptions = {
            'x': x, 'y': y, 'width': width, 'height': height,
            'fill': 'rgba(69,114,167,0.25)', 'stroke-width': 1, 'stroke':'rgba(69,114,167,0.25)','clip-path': 'url(#' + this.svgObject.id +'_ChartAreaClipRect)'
        };
$(id).attr(rectOptions);