Javascript 对列表项进行上下排序

下面是一个非常简单的例子，说明我正在尝试做什么。左侧的Link/按钮用于向上移动项目，右侧的Link/按钮用于向下移动项目。但它不起作用，我得到一个错误：

对象不支持此属性或方法

在这一行：

items[counter-1] = curr;// move
previous item, to current

示例图像：

这是我的密码：

功能移动项（id、方向）{
var ul=document.getElementById（'GroupBy'）；
var items=ul.getElementsByTagName（'li'）；
var计数器=0；
var-previousItem=null；
var moveNextItemUp=false；
for（项目中的var项目）{
//如果为当前项，则为要移动的项
如果（项目==id）{
如果（方向==1）{//项目向下移动
moveNextItemUp=true；
}else如果（（方向==-1）| |（moveNextItemUp==true））{//项目上移
var curr=项目[计数器]；
var prev=项目[计数器-1]；
items[counter-1]=curr；//将上一项移动到当前项
items[counter]=prev；//将当前项移动到上一个
打破
}
}
previousItem=项目；
计数器=计数器+1；
}
}

一


二


三


四

您正在使用

for in

语句，这意味着您无法保证所需的数字顺序

改用

for

语句：

for (var i = 0, len = items.length; i < len; i++) {

示例：

功能移动项（id、方向）{
var ul=document.getElementById（'GroupBy'）；
var items=ul.getElementsByTagName（'li'）；
var计数器=0；
var-previousItem=null；
var moveNextItemUp=false；
对于（变量i=0，len=items.length；i

此外，不确定代码的全部意图是什么，但似乎可以简化如下内容：

items[i].parentNode.insertBefore( items[i],items[i-1] );

示例：

二

并完全摆脱循环：

function MoveItem(item, direction) {

    var counter = 0;
    var previousItem = null;
    var moveNextItemUp = false;

    if (direction == 1) {
        moveNextItemUp = true;
    } else if ((direction == -1) || (moveNextItemUp == true)) {

           // get the previous <li> element
        var prev = item.previousSibling
        while( prev && prev.nodeType != 1 && (prev = prev.previousSibling));

        item.parentNode.insertBefore(item, prev);
    }
    previousItem = item;
    counter = counter + 1;
}

功能移动项目（项目、方向）{
var计数器=0；
var-previousItem=null；
var moveNextItemUp=false；
如果（方向==1）{
moveNextItemUp=true；
}else if（（方向==-1）| |（移动下一个滴度=true））{
//获取上一个
元素
var prev=项。previousSibling
while（prev&&prev.nodeType！=1&&（prev=prev.previousSibling））；
item.parentNode.insertBefore（item，prev）；
}
previousItem=项目；
计数器=计数器+1；
}

要实际移动页面上的元素，需要将它们从文档中删除，然后按所需顺序重新插入。先下线

if (item == id) {

无法按预期工作，因为项是DOM元素，要将其与id进行比较，需要执行以下操作：

if(item.id == id){

---

现在特别针对您的问题，当计数器==0时，项[counter-1]将超出数组的边界并且不存在。

我已注释掉我的for in循环，并将项[I].parentNode代码行（在循环内）放入for循环。但是，当我单击其中一个链接按钮时，会出现“无效参数”javascript错误？谢谢你=]我非常感激！通常我可以看着一些东西，然后一边走一边想出来。。。但在过去的4个小时里，我一直在这件事上碰壁……这是一个很好的观点。我将测试/修复if语句。谢谢：-）-但是如何从文档中删除元素并重新插入它们呢？这里有一篇关于Dom操作的基础文章：。对于您的特定情况，您可以使用items[count].parentNode.removeChild（items[count]），以及使用items[count].parentNode.insertBefore（items[count]，prev）发布的那样；

if (item == id) {

if(item.id == id){