Question

我想在最后一项之后移动列表中的第一项：

<ul>
    <li>1 (this DOM element needs to be moved after 1)</li>
    <li>2</li>
    <li>3</li>
</ul>

在jQuery中这很简单：

$('#scrollable li:last').after($('#scrollable li:first'));

但由于文件限制，我不能使用jQuery或外部lib。我必须使用JavaScript。有没有人有任何想法，我如何用香草JavaScript实现这一点？任何帮助将非常感谢。

更新：感谢@Mano的回答。

Answer 1

您可以像这样使用vanilla JavaScript：在评论中解释

var listitems = document.getElementsByTagName('li'); /* Get all list items */
var lastitem = listitems[listitems.length - 1]; /* Find the last list item */
var parentul = lastitem.parentNode; /* Find the parent element of the items */
parentul.insertBefore(lastitem, listitems[0].nextSibling); /* Replacement for insertAfter() */

<ul>
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
  <li>5 (this DOM element needs to be moved after 1)</li>
</ul>

Answer 2

<ul id="list">
    <li>1</li>
    <li>2</li>
    <li>3 (this DOM element needs to be moved after 1)</li>
</ul>


var ul = document.querySelector("#list");

var children = ul.children;

var len = children.length;

ul.insertBefore(children[len-1],children[1]);

在JavaScript中的最后一个DOM元素之后移动第一个DOM

2 个答案: