javascript - HTMLの行のセルのインデックスを変更します

Question

私は次の表を持っています：

<table class="AMDetailTableCss" id="tblQueueHistory" cellspacing="5" cellpadding="5" >
    <tr>
        <td id="Working">
            <div class="AMQueueName AMWorkingAgent"><div>
            <span class="AMQueueText">Working</span>
            </div></div>
        </td>
        <td id="OnBreak">
            <div class="AMQueueName AMOnBreakAgent"><div>
            <span class="AMQueueText">On Break</span>
            </div></div>
        </td>
        <td id="Idle">
            <div class="AMQueueName AMIdleAgent"><div>
            <span class="AMQueueText">Idle</span>
            </div></div>
        </td>
    </tr>
</table>

tdjavascript/Jqueryを使用して実行時にのインデックスを変更したい。つまり、2番目tdを最初に移動する必要があります。

これどうやってするの？ありがとう

Answer 1

これを試して：

$("#OnBreak").detach().insertBefore("#Working")

フィドルの例

を使用detach()すると、に割り当てられたイベントまたはデータも確実にtd移動されます。

Answer 2

var firstHtml=$('#Working').html();
var secondHtml=$('#OnBreak').html();

$('#OnBreak').html(firstHtml);
$('#Working').html(secondHtml);

デモ

Answer 3

いつこれをしたいですか？

$("#OnBreak").prependTo($("#OnBreak").parent());