I’m having trouble applying the same function more than once. This function should populate my <ul></ul>
element with <li></li>
s.
I will illustrate with images:
The code is available at the sandbox.
How could I solve this?
I’m having trouble applying the same function more than once. This function should populate my <ul></ul>
element with <li></li>
s.
I will illustrate with images:
The code is available at the sandbox.
How could I solve this?
Sandbox:
Your JS file is named card.js
but you are referencing cards.js
in the HTML.
I do not see a call to the initGame
function.
populate
should not return a function.
When calling populateWith
you do not want to return.
Read the docs for appendChild it does not work like you think it does. Look at the link given to cloneNode
.
var initGame = () => filterCards(howMany());
var howMany = () => prompt('With how many cards you wish to play with?');
var filterCards = (number) =>
number % 2 === 0 && number > 4 && number < 14
? createCards(number)
: initGame();
var querier = (e) => document.querySelector(e);
var ul = querier('ul');
let li = document.createElement('li');
var populateWith = (e) => (li) => e.appendChild(li.cloneNode(true));
var populate = (number) => {
console.log(number);
for (var i = 0; i < number; i++) {
populateWith(ul)(li);
}
};
var createCards = (number) => populate(number);
initGame();
I thought appendChild, used in populateWidth’s definition, would append childs on after the another on the father element, if I iterated with it.
That can be done, but, as Iasjorg has done, I had to clone the the li element to make it a “fresh” element. So, when we call e.appendChild(clone) it’s never a repetition.
appendChild will delete the node and renew it, if we append an already appended note to where it was supposed to be. In other words, it didn’t had the behavior I thought it had, as Iasjorg had pointed out wisely, again!
Thank you both. And, I will practice some more with this functions. Because there are still a little obscure to me.
I have to make these cards flip and stay flipped if the match, in tuples, now. Wish me good luck!
This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.