在单个jQuery调用中计算和编辑多个属性

Question

我需要使用单个jQuery调用来计算new并编辑SVG元素（rect）的'x'和'y'属性。

现在我知道你可以这样做：

var incBy = 20; 

$('#test').attr('x', function(i, val) { 
    return parseInt(val) + incBy; 
}); 

这是很好的计算和编辑单一属性，但我怎么可以编辑在这样多重属性？

Answer 1

如果您因素出来，你也可以做到在同一行：

$('#test').attr('x', myFunction).attr('y', myFunction); 

function myFunction(i, val) { 
    return parseInt(val) + incBy; 
} 

或抽象它更多传递到一个单独的功能属性要将此应用到

process('x', 'y'); 

function process() { 
    for (var i = 0; i < process.arguments.length; i++) 
    $('test').attr(process.arguments[i]), myfunction); 

    function myFunction(i, val) { 
    return parseInt(val) + incBy; 
    } 
} 

这取决于你想走多远。您可以在参数中包含要调用的函数，也可以包含选择标准。

Answer 2

我不确定如何在多个属性上执行此操作，但是如果您正在寻找防止重复代码的方法，则可以重构匿名函数。

$('#test').attr('x', myFunction); 
$('#test').attr('y', myFunction); 

function myFunction(i, val) { 
    return parseInt(val) + incBy; 
} 

Answer 3

var incBy = 20; 

$('#test').each(function() { 
    this.x += incBy; 
    this.y += incBy; 
}); 

，或者更优雅，这

$.fn.extend({ 
    modCoordsBy: function(amount) { 
    for (var i=0, j=this.length; i<j; i++) { 
     this[i].x += amount; 
     this[i].y += amount; 
    } 
    return this; 
    } 
}); 

$('#test').modCoordsBy(20); 

适用范围检查或型式试验，以x和y为（如果你还想要修改成千上万个对象具有更高的性能）你觉得合适。

Answer 4

你可以尝试使用带有jQuery的attr方法的地图。

$('#test').attr(
     {'x': editValue, 
     'y': editValue 
     }); 
function editValue(i, val) { 
    return parseInt(val) + incBy; 
};