将DIV元素移动到父级的底部（作为最后一个小孩） [英] Moving a DIV element to bottom of parent (as last child)

问题描述

我正在为我正在开发的网站首页的顶部创建一个不断旋转的横幅。我可以想象的最好的方式是保持它不断的旋转是采取第一个DIV（firstChild），并将其移动到堆栈的一端，一旦它滑出视图。

I'm trying to create a continually rotating banner for the top of the homepage of a site I'm developing. The best way that I can figure to keep it constantly in rotation is to take the first DIV (firstChild) and move it to the end of the stack once it's slid out of view.

This：

<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的底部，但是我发现并不是所有的风格属性都被转载，我想放弃这个方法，因为我不希望被移动成为一个

I use the Prototype framework... and I've tried to do this by cloning the element using my own method and inserting it into the bottom of the parent DIV, but I find that not all of the style attributes are being carried over, and I'd like to abandon this method because I don't want what's being moved to be a copy/clone of the element, but the actual element itself.

谢谢。

推荐答案

这是一些简单的javascript，假设div有一个有效的父项：

Here's some plain javascript to do it, assuming the div has a valid parent:

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

本质上你会得到节点，然后将其附加到其父级。 appendChild ，如果节点已经是DOM的一部分，将把节点从当前位置移动到DOM中的新位置。

Essentially you get the node, then append it to its parent. appendChild, if the node is already part of the DOM, will move the node from its current position to the new position in the DOM.

这篇关于将DIV元素移动到父级的底部（作为最后一个小孩）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！