Javascript slice() n'est pas une fonction avec ma liste d'éléments li

Question

Comment transformer la jquery suivante en javascript?

iElement.children('li') 
.css({ "background": "#DDD" }) 
.slice(0, 1) 
.css({ "background": c.col }); 

IElement.children('li') renvoie les éléments suivants:

[li.point, li.point, li.point, li.point, li.point] 

où iElement est un ul. Le problème vient avec slice(). iElement est un tableau d'objets mais j'obtiens une erreur en disant que whatever.slice() n'est pas une fonction

J'essaye d'écrire une directive de force de mot de passe pour mon application d'angularjs.

Answer 1

Vous obtenez cette exception parce que vous essayez d'appeler une méthode Array (.slice()) sur une nodeList qui n'est pas array.

Vous devez traiter cette nodeList comme array, vous pouvez:

• Soit convertir avec Array.from() méthode avant d'appeler .slice().
• ou appelez comme ceci: Array.prototype.slice.call(IElement.children('li'));

Answer 2

On dirait qu'elle est conçue juste le premier élément à une autre couleur:

elements = document.querySelectorAll('ul#iElement > li') 
 
c = { col:'#ABC' } 
 

 
for (var i = 1; i < elements.length; i++) 
 
    elements[i].style.background = '#DDD' 
 
    
 
if (elements[0]) elements[0].style.background = c.col

<ul id='iElement'> 
 
    <li> 1 </li> 
 
    <li> 2 </li> 
 
    <li> 3 </li> 
 
    <li> 4 </li> 
 
</ul>