1

複数のパス コンテナーを反復処理し<g>、それぞれに一意のクラスを追加する必要があります。次に、コンテナー内のパスごとに一意のクラスを追加する必要があります。

これは私の出力です：

<svg>
  <g>
    <path class="active" fill="#1f77b4" d="M1.0715305595945801e-14,-175A175,175 0 0,1 151.55444566227678,87.49999999999997L138.5640646055102,79.99999999999997A160,160 0 0,0 9.796850830579018e-15,-160Z"></path>
    <path class="active" fill="#aec7e8" d="M151.55444566227678,87.49999999999997A175,175 0 0,1 -151.55444566227675,87.50000000000006L-138.56406460551017,80.00000000000006A160,160 0 0,0 138.5640646055102,79.99999999999997Z"></path>
    <path class="active" fill="#ff7f0e" d="M-151.55444566227675,87.50000000000006A175,175 0 0,1 -3.21459167878374e-14,-175L-2.9390552491737054e-14,-160A160,160 0 0,0 -138.56406460551017,80.00000000000006Z"></path>
  </g>
  <g>
    <path class="active" fill="#1f77b4" d="M1.0715305595945801e-14,-175A175,175 0 0,1 151.55444566227678,87.49999999999997L138.5640646055102,79.99999999999997A160,160 0 0,0 9.796850830579018e-15,-160Z"></path>
    <path class="active" fill="#aec7e8" d="M151.55444566227678,87.49999999999997A175,175 0 0,1 -151.55444566227675,87.50000000000006L-138.56406460551017,80.00000000000006A160,160 0 0,0 138.5640646055102,79.99999999999997Z"></path>
    <path class="active" fill="#ff7f0e" d="M-151.55444566227675,87.50000000000006A175,175 0 0,1 -3.21459167878374e-14,-175L-2.9390552491737054e-14,-160A160,160 0 0,0 -138.56406460551017,80.00000000000006Z"></path>
  </g>
</svg>

私は次のことができます：

$.each(path, function(i,elem) {
    $(elem).parent('g').attr('class','active' + i);
});
4

2 に答える 2

1

を使用しようとしています$.each。これは配列 [] で機能します。ドキュメントによると、

オブジェクトと配列の両方をシームレスに反復処理するために使用できる汎用イテレータ関数。長さのプロパティを持つ配列および配列のようなオブジェクト(関数の引数オブ​​ジェクトなど) は、0 から長さ 1 までの数値インデックスによって反復されます。他のオブジェクトは、名前付きプロパティを介して反復されます。

DOM 要素の場合は、 を使用する必要があります$("selector").each()。ドキュメントによると、

jQueryオブジェクトを繰り返し処理し、一致した要素ごとに関数を実行します。

もっと ：

$.each() 関数は、jQuery オブジェクトを排他的に反復処理するために使用される $(selector).each() と同じではありません。

したがって、次のようにする必要があります。

$("path").each( function(i) {
    $(this).attr("class","yourClass").parent('g').attr('class','active' + i);
});

現在の要素にアクセスするには、 を使用する必要があります$(this)。

于 2013-07-07T11:49:34.663 に答える