idが

Question

で始まる最初の兄弟のセレクタ

次のシナリオで正しいセレクタ/ jqueryコードを見つけるのに問題があります。 SIEcatで始まるidのtrの開始点からSIEcatで始まる次の行の前に新しい行を挿入しますか？

<table> 
 
    <tr id="SIEcat1"><td>Columncode</td></tr> 
 
    <tr class="SIErow"><td>Columncode</td></tr> 
 
    <tr class="SIErow"><td>Columncode</td></tr> 
 
    <tr class="SIErow"><td>Columncode</td></tr> 
 
    <tr id="SIEcat2"><td>Columncode</td></tr> 
 
    <tr class="SIErow"><td>Columncode</td></tr> 
 
    <tr class="SIErow"><td>Columncode</td></tr> 
 
    <tr class="SIErow"><td>Columncode</td></tr> 
 
</table>

など

コードこれまで

$("#SIEcat1").selectorcodeXXX.before('<tr class="SIErow">xxxx</tr>'); 

Answer 1

CSS属性の組み合わせを使用して、開始し、jQueryのnextAll（）セレクタ：

$('[id^=SIEcat]').nextAll('[id^=SIEcat]').before('<tr class="SIErow"><td>xxxx</td></tr>');

これはSIEcat始まるIDを持つ要素を選択し、次いで、反復処理次のすべての兄弟をSIEcatで始まる次のIDを見つけてその前に挿入します。

Codepen example。

Answer 2

あなたはセレクター "で始まり" を使用することができます：^=とfirst方法、このような
：$('[id^=SIEcat]').first()

$('[id^=SIEcat]').first().before('<tr class="SIErow"><td>xxxx</td></tr>');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    <tr id="SIEcat1"><td>Columncode</td></tr> 
 
    <tr class="SIErow"><td>Columncode</td></tr> 
 
    <tr class="SIErow"><td>Columncode</td></tr> 
 
    <tr class="SIErow"><td>Columncode</td></tr> 
 
    <tr id="SIEcat2"><td>Columncode</td></tr> 
 
    <tr class="SIErow"><td>Columncode</td></tr> 
 
    <tr class="SIErow"><td>Columncode</td></tr> 
 
    <tr class="SIErow"><td>Columncode</td></tr> 
 
</table>

Answer 3

あなたは、次のセレクタ使用することができます

$('[id^=SIEcat]:not(:first-child)').before('<tr class="SIErow"><td>xxxx</td></tr>');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    <tr id="SIEcat1"><td>Columncode</td></tr> 
 
    <tr class="SIErow"><td>Columncode</td></tr> 
 
    <tr class="SIErow"><td>Columncode</td></tr> 
 
    <tr class="SIErow"><td>Columncode</td></tr> 
 
    <tr id="SIEcat2"><td>Columncode</td></tr> 
 
    <tr class="SIErow"><td>Columncode</td></tr> 
 
    <tr class="SIErow"><td>Columncode</td></tr> 
 
    <tr class="SIErow"><td>Columncode</td></tr> 
 
</table>