Javascript 循环 <UL>一键旋转列表

Javascript Loop <UL> rotate a list with one click

本文关键字：一键 旋转 列表 UL Javascript 循环      更新时间：2023-09-26

我在下面有以下函数，它应该旋转/循环浏览 4 个项目的列表，它确实通过点击工作。但是，用户必须单击两次才能执行循环。

function rotateList(){
var list = document.getElementById("arrange");
var first = list.removeChild(list.firstChild);
list.appendChild(first);
}

有谁知道如何一键使上述工作？

提前非常感谢。

function rotateList() {
    var list = document.getElementById("arrange");
    list.appendChild(list.firstElementChild);
}

请注意，任何 DOM 节点在文档中只能存在一次。如果将其附加到一个位置，则会在其原始位置将其删除。

这样附加第一个子节点具有所需的效果。

firstElementChild给你"真正的"第一个孩子，而firstChild也给你元素之间可能发生的（空白）文本节点，这就是让你点击两次的原因。但是，在 IE9 之前不支持firstElementChild。其他浏览器没有问题。

http://jsfiddle.net/Vb8dY/1/

相关文章：