Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

170
Visualizações
Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node' error

Basically adding a forEach loop to spit out my array right now while practicing using DOM. I get the error in my console log. In my html I have the ul class "pokemon-list", and an empty li with the class "list-item".. What exactly did I do wrong here?

//IIFE function
let pokemonRepository = (function () {
  //List of pokemon Array
  let pokemonList = [
    {
     name: 'Bulbasaur ',
     height: 2.4,
     types: ['Grass ', 'Poison']
   },
    {
     name: ' Charmander ',
     height: 2,
     types: 'Fire'
   },
    {
     name: ' Squirtle ',
     height: 1.8,
     types: 'Water'
   }
  ];
//adds pokemon to the pokedex
  function add(pokemon) {
    pokemonList.push(pokemon);
  }
  function getAll() {
    return pokemonList
  }
  return {
    add: add,
    getAll: getAll
  }
})();
// for each function to write pokemon and its name
  pokemonRepository.getAll().forEach(function(pokemon){
  let listContainer = document.querySelector('.pokemon-list');
  let listItem = document.createElement('li');
  let button = document.createElement('button');
  button.innerText = pokemonRepository.name
  button.classList.add('poke-button');
  button.appendChild(listContainer);
  button.appendChild(listItem)
});
about 4 years ago · Juan Pablo Isaza
1 Respostas
Responde à pergunta

0

From what I understand you are trying to make a list of buttons, but from your code that is not what is happening. You are trying to embed a list inside a button.

<ul class="pokemon-list">

</ul>

<script>
//IIFE function
let pokemonRepository = (function () {
  //List of pokemon Array
  let pokemonList = [
    {
     name: 'Bulbasaur ',
     height: 2.4,
     types: ['Grass ', 'Poison']
   },
    {
     name: ' Charmander ',
     height: 2,
     types: 'Fire'
   },
    {
     name: ' Squirtle ',
     height: 1.8,
     types: 'Water'
   }
  ];
//adds pokemon to the pokedex
  function add(pokemon) {
    pokemonList.push(pokemon);
  }
  function getAll() {
    return pokemonList
  }
  return {
    add: add,
    getAll: getAll
  }
})();
// for each function to write pokemon and its name
  pokemonRepository.getAll().forEach(function(pokemon){
  let listContainer = document.querySelector('.pokemon-list');
  let listItem = document.createElement('li');
  let button = document.createElement('button');
  button.innerText = pokemon.name;
  button.classList.add('poke-button');
  listItem.appendChild(button);
  listContainer.appendChild(listItem);
});

I spotted some few things.

  1. button.innerText = pokemonRepository.name should be pokemon.name
  2. You are appending listContainer and listItem to the button so change the followings.

button.appendChild(listContainer); button.appendChild(listItem)

to

listItem.appendChild(button); listContainer.appendChild(listItem);

about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda