Javascript 如何交换第一个和最后一个DOM元素

例如，如何在没有jquery的情况下将第一个列表项与最后一个列表项交换

<ul>
    <li>1</li>
    <li>2</li>
    <li>3</li>
</ul>

jsiddle:

更新： 如果要交换，请执行以下操作：

注: replaceChild：第一个参数是要替换的参数，第二个参数是要替换的参数。

---

ref:

看看这个，你可以使用不同的javascript元素，比如firstelementchild和LastElementChild。到目前为止，你发现并尝试了什么？没有，我尝试了RepaceChild方法，但没有成功！你能告诉我这有什么问题吗？你能告诉我这有什么问题吗。只是不完整。您没有将最后一个元素放在前面。但是第一个列表项去了哪里？提供解释而不仅仅是代码更有价值。

var ul = document.querySelector("ul"),
    first = ul.firstElementChild,
    last = ul.lastElementChild;
ul.replaceChild(first,last);

    var ul = document.getElementById("ul")
    var last = ul.lastElementChild
    var first = ul.firstElementChild
    ul.replaceChild(ul.firstElementChild, ul.lastElementChild)
    ul.insertBefore(last, ul.firstElementChild)