0

質問

特定の一致セットの後、または代わりに、一致セットが空の場合はテーブルの最後に新しい TR をテーブルに追加したいと思います。次の html があるとします。

<table id="blax">
   <thead>
   </thead>
   <tbody>
      <tr class="alpha">
         <td>some stuff</td>
         <td>more stuff</td>
      </tr>
      <tr class="alpha">
         <td>some stuff</td>
         <td>more stuff</td>
      </tr>
      <!-- new "alpha" tr to go here-->
      <tr class="beta">
         <td>some stuff</td>
         <td>more stuff</td>
      </tr>
      <tr class="beta">
         <td>some stuff</td>
         <td>more stuff</td>
      </tr>
      <!-- but new "gamma" tr to go at end-->
   </tbody>'
</table>

たとえば、一致したセットの後に新しい tr を追加する方法を知っています。

var b = $('#blax tbody');
var newAlphaTr = $('<tr class="alpha"></tr>')
   .insertAfter(b.find('tr.alpha:last'));

gammaしかし、クラス(テーブルにはまだ存在しない)に対して同じコードを実行するとどうなるでしょうか? アルファ挿入に使用したのと同じコードを使用して<tr class="gamma"></tr>、新しい要素の挿入ポイントをテーブルの最後に配置する簡単な方法は何ですか?

function insertAtPosition(parentElement, afterElement, newElement) {
   // some code here that does the job for either "alpha" or "gamma"
}

function creatElement(className) {
   insertAtPosition(
      b,
      b.find('tr.' + className + ':last'),
      $('<tr class="' + className + '"></tr>'
   );
}

createElement('alpha');
createElement('gamma');

「some code here」ブロックに記入するのに助けが必要です。

では、暇つぶしにおしゃべりしましょう

ちなみにinsertAfter、挿入された要素または追加されたアイテムを返しますか? 方法や仕事のようにafter、挿入されたアイテムを返し、それが添付されたアイテムを返すと思いますか？jQuery のドキュメントは優れていますが、各関数から返されるものがリストされていないなど、いくつかの大きな穴があります (これを見逃す人がいることに非常に困惑しています)。実際、私がこの質問を書いていたとき、私が正しく理解していることを確認するには、かなりの集中力が必要でした.insertAfterappendappendTo

ぼんやり考えただけで、アイテムが追加されるすべての後にインデックス位置または直接の子要素（または直接の子要素のセット）であるオプションのパラメーターがサポートされてappendいればいいでしょう。appendToインデックスの場合、0 または -1 が最初の子であることを意味するように、目的の位置またはアイテムを挿入する位置のいずれかになります。

var b = $('#blax tbody');
var newAlphaTr = $('<tr class="alpha"></tr>')
   .appendTo(b, $('tr.alpha', b));
// or perhaps a selector
var newAlphaTr2 = $('<tr class="alpha"></tr>')
  .appendTo(b, 'tr.alpha:last');

alphaこれにより、指定された子セットの後にクラスを持つ新しい tr が挿入されます。:lastセレクターに追加することもできますが、この方法がいいでしょう。「td.alpha」の一致したセットが空の場合、append が通常行うように動作し、既存の子の後に配置されます。

4

2 に答える 2

0 
<tbody id='zeta'/>

$('#zeta').append('<tr class="alpha"></tr>');

if / elseとして実行してもよろしいですか？

if（$（'。alpha'）。length> 0）{
//クラスに追加
} else{
//tbodyに追加
}

于 2010-10-26T21:06:18.533 に答える
0

質問をして以来、ほぼ 2 年間の jQuery の経験があり、答えが簡単であることがわかりました。

var b = $('#blax tbody'),
   newAlphaTr = $('<tr class="alpha"></tr>')
      .insertAfter(
         b.find('tr.alpha:last, tr:last')
            .first()
      );

目的のクラスとのみ一致するのではなく、クラスに関係なくtr最後も一致しtrます。次に、最初のものを でつかみfirst()ます。これは、後に挿入したいものになります。問題が解決しました。

于 2012-08-03T20:26:03.117 に答える