12

開発中のサイトのホームページの上部に、継続的に回転するバナーを作成しようとしています。常にローテーションを維持するための最善の方法は、最初の DIV (firstChild) を取得し、スライドして見えなくなったらスタックの最後に移動することです。

これ：

<div id='foo0'></div>
<div id='foo1'></div>
<div id='foo2'></div>
<div id='foo3'></div>

これになるはずです：

<div id='foo1'></div>
<div id='foo2'></div>
<div id='foo3'></div>
<div id='foo0'></div>

私は Prototype フレームワークを使用しています...そして、独自の方法を使用して要素を複製し、親 DIV の下部に挿入することでこれを実行しようとしましたが、すべてのスタイル属性が引き継がれているわけではありません。移動するものを要素のコピー/クローンにするのではなく、実際の要素自体にしたくないので、このメソッドを放棄したいと思います。

ありがとう。

4

2 に答える 2

26

div に有効な親があると仮定して、これを行うための単純な JavaScript を次に示します。

var d = document.getElementById('foo0');
d.parentNode.appendChild(d);

基本的に、ノードを取得してから、その親に追加します。appendChild、ノードが既に DOM の一部である場合、ノードを現在の位置から DOM 内の新しい位置に移動します。

于 2010-08-05T14:12:43.057 に答える
2

div を親 div でラップします。

    var parentElement =  document.querySelector("#yourParentDiv");
    parentElement.appendChild(parentElement.firstElementChild);
于 2015-06-03T07:06:07.413 に答える