Javascript 使用循环移动列表中的选中项

我有两个无序列表，列表项中有复选框。我想将一侧的所有支票项目同时移动到另一侧。目前它一次只移动一个，或者偶尔一次移动两个，并给我错误。我想我的循环有问题吗

石灰





香蕉


梨

javascript:

//move function
function moveLeft () {
    var selectlist = document.getElementById('select2');
    var hom = selectlist.getElementsByTagName("li");
    var homs = selectlist.getElementsByTagName("li").length; //count the number of list items and set as homs
    for (var i=0;i<homs;i++){
      var subcheck = hom[i].getElementsByTagName('input')[0];

      if (subcheck.checked) {
        document.getElementById('select1').appendChild(hom[i]);
    } 


    };
};

function moveRight () {
    var selectlist = document.getElementById('select1');
    var hom = selectlist.getElementsByTagName("li");
    var homs = selectlist.getElementsByTagName("li").length; //count the number of list items and set as homs
    for (var i=0;i<homs;i++){
      var subcheck = hom[i].getElementsByTagName('input')[0];

      if (subcheck.checked) {
        document.getElementById('select2').appendChild(hom[i]);
    } 


    };
};

//移动函数
函数左移（）{
var selectlist=document.getElementById（'select2'）；
var hom=selectlist.getElementsByTagName（“li”）；
var homs=selectlist.getElementsByTagName（“li”）.length；//计算列表项的数量并设置为homs
对于（var i=0；i，正如Evan所说，您在迭代列表时正在修改它。如果您单独构建列表，然后在上面迭代（因为移动元素时它不会收缩），它将起作用。下面是一个快速示例：

//move function
function moveLeft () {
    var selectlist = document.getElementById('select2');
    var hom = selectlist.getElementsByTagName("li");
    var homs = selectlist.getElementsByTagName("li").length;
    var toMove = [];
    //count the number of list items and set as homs
    for (var i=0;i<homs;i++){
        var subcheck = hom[i].getElementsByTagName('input')[0];
    if (subcheck.checked) {
           toMove.push(hom[i]);     
        }
    };
    for (var i = 0; i < toMove.length; i++) {
      document.getElementById('select1').appendChild(toMove[i]);
    }
};

//移动函数
函数左移（）{
var selectlist=document.getElementById（'select2'）；
var hom=selectlist.getElementsByTagName（“li”）；
var homs=selectlist.getElementsByTagName（“li”）.length；
var-toMove=[]；
//计算列表项的数量并设置为homs
对于（var i=0；i）您在迭代列表时正在修改列表。我理解您所说的内容，尽管您给出的示例似乎并不实际有效。这起初对我不起作用，但现在似乎起作用了。谢谢。
//move function
function moveLeft () {
    var selectlist = document.getElementById('select2');
    var hom = selectlist.getElementsByTagName("li");
    var homs = selectlist.getElementsByTagName("li").length;
    var toMove = [];
    //count the number of list items and set as homs
    for (var i=0;i<homs;i++){
        var subcheck = hom[i].getElementsByTagName('input')[0];
    if (subcheck.checked) {
           toMove.push(hom[i]);     
        }
    };
    for (var i = 0; i < toMove.length; i++) {
      document.getElementById('select1').appendChild(toMove[i]);
    }
};