JavaScript - bardzo zmieszany przy usuwaniu elementów z kontenera

Tworzę w trybie JavaScript pojedynczy odtwarzacz w formacie Zelda 2D i top-down.

Kiedy gracz (fioletowa koszula) podchodzi do kota, „uratuje” go ... co zasadniczo usuwaanimalContainer zContainerOfAnimals (usuwając w ten sposób BMP zwierzęcia ze sceny), a następnie dodaj id tego zwierzęcia Kontener do arescuedTotal_Array...

Dziwne jest to, że na zdjęciu poniżej jestem w stanie uratowaćanimalContainer2 inastępnie ratowaćanimalContainer1... Ale jeśli odejdęanimalContainer1 doanimalContainer2, rzuca a

Uncaught TypeError: Cannot read property 'id' of undefined` error. 

...Gruntownie:

Sposób działania: pobierz identyfikator 22, a następnie identyfikator 21 - >>> Zauważyłem w tym, że nazwa elementu nie zmienia się dla ID ... nie jestem pewien, dlaczego ... więc dla zepsutego sposobu ... może nie być nawet w stanie skojarzyć nazwy elementuanimalContainer2 z identyfikatorem? Ale nie wiem, w jaki sposób identyfikator i nazwa mogą się tak odłączyć ...

ID in rescued array...: 22, element name: animalContainer1, rescued array length: 2, elem index pos: 0, index: 0

ID in rescued array...: 21, element name: animalContainer1, rescued array length: 2, elem index pos: 1, index: 0 

Błąd zerwanego toru: zdobądź ID 21, a następnie ID 22

ID in rescued array...: 21, element name: animalContainer1, rescued array length: 1, elem index pos: 0, index: 0 

1. Uncaught TypeError: Cannot read property 'id' of undefined 

Fragment kodu:

        function grabIt(NPC_id, index) {
            //check if NPCid already exists in array before adding...
            if ($.inArray(ContainerOfAnimals.children[index].id, rescuedTotal_Array) == -1) {
                rescuedTotal_Array.push(ContainerOfAnimals.children[index].id);
            }
            if (rescuedTotal_Array.length == 2) {
                for (var z = 0; z < rescuedTotal_Array.length; z++) {
                    console.log("ID in rescued array...: " + rescuedTotal_Array[z] + ", \n element name: " + ContainerOfAnimals.children[index].name + ", rescued array length: " + rescuedTotal_Array.length + ",\n elem index pos: " + z + ",\n index: " + index);
                }
            }
            //when I remove the first added element to rescuedTotalArray... the 2nd element's index assumes first added element's index... (goes from 1 to 0)
            console.log(index);
            console.log("element removed: " + ContainerOfAnimals.children[index]);
            stage.update();
            ContainerOfAnimals.removeChild(ContainerOfAnimals.children[index]);
            updateHUD();
        }

Nie mam pojęcia, dlaczego kolejność przechowywania elementów w tablicy / usuwania ich ze sceny miałaby znaczenie ...

EDIT: Czuję, że mogę rozwiązać ten problem, usuwając element z ContainerOfAnimals przez element ID zamiast przez indeks ... przez obiekt Container oferuje niegetChildID() funkcjonować...

więc spróbowałem:

    var childToRemove = document.getElementById(ContainerOfAnimals.children[index]);
    console.log(childToRemove);
    ContainerOfAnimals.removeChild(childToRemove);

console.log (childToRemove) daje minull dla dzieci

Ale robiąc to:console.log(ContainerOfAnimals.children[index].id); daje mi identyfikator21, który jest prawidłowym identyfikatorem ...

questionAnswers(4)

yourAnswerToTheQuestion