2012-06-27 111 views
1

我想要得到div中的每个圆圈,所以我可以调整它使用jquery。我的代码如下:迭代通过每个html标签

<div id="DG_circles"> 
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="200" height="75"> 
<desc>Created with Raphaël</desc> 
<defs> 
<circle cx="39" cy="39.5" r="16" fill="#d57b19" stroke="none" style="stroke-width: 0;" stroke-width="0"> 
<image x="28.8" y="29.3" width="22.4" height="22.4" preserveAspectRatio="none" href="load?name=icon-hotel-chart"> 
<text x="39" y="17.5" text-anchor="middle" style="text-anchor: middle; font: bold 9px Arial,Verdana,Courier; stroke-width: 0;" font="10px "Arial"" stroke="none" fill="#333333" font-size="9px" font-family="Arial, Verdana, Courier" stroke-width="0" font-weight="bold"> 
<circle cx="91" cy="39.5" r="16" fill="#b1102b" stroke="none" style="stroke-width: 0;" stroke-width="0"> 
<image x="80.8" y="29.3" width="22.4" height="22.4" preserveAspectRatio="none" href="load?name=icon-card-chart"> 
<text x="91" y="17.5" text-anchor="middle" style="text-anchor: middle; font: bold 9px Arial,Verdana,Courier; stroke-width: 0;" font="10px "Arial"" stroke="none" fill="#333333" font-size="9px" font-family="Arial, Verdana, Courier" stroke-width="0" font-weight="bold"> 
<circle cx="143" cy="39.5" r="16" fill="#85bb3c" stroke="none" style="stroke-width: 0;" stroke-width="0"> 
<image x="132.8" y="29.3" width="22.4" height="22.4" preserveAspectRatio="none" href="load?name=icon-airplane-chart"> 
<text x="143" y="17.5" text-anchor="middle" style="text-anchor: middle; font: bold 9px Arial,Verdana,Courier; stroke-width: 0;" font="10px "Arial"" stroke="none" fill="#333333" font-size="9px" font-family="Arial, Verdana, Courier" stroke-width="0" font-weight="bold"> 
</svg> 
</div>​ 


var $circle = $('#DG_circles').find("circle"); 

$circle.each(function(index, value){ 
    if(index == 0){ 
     $this.attr("r", "24"); 
    } else if(index == 1){ 
     $this.attr("r", "20"); 
    } else if(index == 2){ 
     $this.attr("r", "18"); 
    } 
}); 

但它不会改变圆的“r”属性。 请帮忙。 谢谢。

+0

这是编写循环的奇怪方法。 – asawyer

+0

@asawyer这样做的最佳方式是什么? – newbie

回答

3

为什么你甚至需要在这里使用each

var $circle = $('#DG_circles').find("circle"); 
$circle.eq(0).attr("r", "24"); 
$circle.eq(1).attr("r", "20"); 
$circle.eq(2).attr("r", "18"); 
+0

tnx这是一个很好的解决方案 – newbie

1

this是一个dom元素,而不是jQuery。您必须将其转换为jQuery元素才能使用jQuery函数。

$(this).attr('r', 24); 
1

尝试....

var circle = $('#DG_circles').find("circle"); 

circle.each(function(index, value){ 
    if(index == 0){ 
     $(this).attr("r", "24"); 
    } else if(index == 1){ 
     $(this).attr("r", "20"); 
    } else if(index == 2){ 
     $(this).attr("r", "18"); 
    } 
});