在JavaScript中，将第一个DOM移动到最后一个DOM元素之后

我正在尝试将列表中的第一项移动到最后一项之后：

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

但由于文件限制，我不能使用jQuery或外部库。我必须使用JavaScript。关于我如何仅使用香草JavaScript实现这一点，有人有什么想法吗？任何帮助都将不胜感激

---

更新：感谢@Mano的回答。

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

var listitems=document.getElementsByTagName（'li'）；/*获取所有列表项*/
var lastitem=listitems[listitems.length-1]；/*查找最后一个列表项*/
var parentul=lastitem.parentNode；/*查找项目的父元素*/
parentul.insertBefore（lastitem，listitems[0].nextSibling）；/*替换insertAfter（）*/

一,
二,
三,
四,
5（此DOM元素需要在1之后移动）

您可以像这样使用普通JavaScript：在注释中解释

var listitems=document.getElementsByTagName（'li'）；/*获取所有列表项*/
var lastitem=listitems[listitems.length-1]；/*查找最后一个列表项*/
var parentul=lastitem.parentNode；/*查找项目的父元素*/
parentul.insertBefore（lastitem，listitems[0].nextSibling）；/*替换insertAfter（）*/

一,
二,
三,
四,
5（此DOM元素需要在1之后移动）

• 一,
• 二,
• 3（此DOM元素需要在1之后移动）

var ul=document.querySelector（“列表”）； var children=ul children； var len=children.length； ul.插入前（儿童[len-1]，儿童[1]）；

一,
二,
3（此DOM元素需要在1之后移动）

var ul=document.querySelector（“列表”）；
var children=ul children；
var len=children.length；
ul.插入前（儿童[len-1]，儿童[1]）；

非常感谢您的回答。它在一定程度上可以工作，但我注意到它不像jQuery那样工作。例如，在jQuery中，顺序仍然是连续的：2,3,4,1，但在解决方案中，如果顺序是混合的：1,3,2,4。我不确定您所说的混合是什么意思。在输出屏幕中，我可以查看

1、5、2、3、4。

这里是顺序的，只是最后一个元素的DOM顺序被更改并放在第一个元素之后。对不起，我弄糊涂了。基本上，jquery代码在最后一项之后添加第一项。与我说的正好相反。我已经更新了你的代码，现在可以使用了。谢谢你的帮助，没问题。它发生了！：）非常感谢你的回答。它在一定程度上可以工作，但我注意到它不像jQuery那样工作。例如，在jQuery中，顺序仍然是连续的：2,3,4,1，但在解决方案中，如果顺序是混合的：1,3,2,4。我不确定您所说的混合是什么意思。在输出屏幕中，我可以查看

1、5、2、3、4。

这里是顺序的，只是最后一个元素的DOM顺序被更改并放在第一个元素之后。对不起，我弄糊涂了。基本上，jquery代码在最后一项之后添加第一项。与我说的正好相反。我已经更新了你的代码，现在可以使用了。谢谢你的帮助，没问题。它发生了！：）

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

<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]);