Cuando estoy usando la propiedad de longitud sobre la colección HTML, obtengo cero... Por favor, corríjame alguien...
Mi código HTML:
<div class="container"> <div class="header"> <h1>To Do List</h1> </div> <div class="todos"> <ul class="todolist"> <li class="listItem"> <p>Doing Homework</p> </li> <li class="listItem"> <p>Doing Competitve Programming</p> </li> <li class="listItem"> <p>Doing Dynamic Programming</p> </li> <li class="listItem"> <p>Doing Robot Programming</p> </li> <li class="listItem"> <p>Doing DSA</p> </li> </ul> </div> </div> </body>MI código JS:
function crossAdder() { var todolist = document.getElementsByClassName('.listItem'); console.log(todolist.length); } crossAdder();. en .listItem cuando ingresa a la función document.getElementsByClassName .
Acepta un nombre de clase, no un selector CSS.
function crossAdder() { var todolist = document.getElementsByClassName('listItem'); console.log(todolist.length); } crossAdder(); <div class="container"> <div class="header"> <h1>To Do List</h1> </div> <div class="todos"> <ul class="todolist"> <li class="listItem"> <p>Doing Homework</p> </li> <li class="listItem"> <p>Doing Competitve Programming</p> </li> <li class="listItem"> <p>Doing Dynamic Programming</p> </li> <li class="listItem"> <p>Doing Robot Programming</p> </li> <li class="listItem"> <p>Doing DSA</p> </li> </ul> </div> </div> </body> function crossAdder(){ //Use query selector if you are using .listItem var todoList = document.querySelectorAll(".listItem") //If you are using getElementsByClassName don't use the dot only need just listItem var todoList = document.getElementsByClassName("listItem") console.log(todoList) }