Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

194
Vistas
document.getElementByClassName no funciona junto con for-loop

Estoy tratando de hacer que solo algunos cuadros específicos tengan relleno a la izquierda y a la derecha, pero el código no pasa la parte "getElementByClassName". Recibo la alerta "Test1" pero no "Test2", por lo que creo que el problema está en algún lugar de esa línea.

 <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script> <script type="text/javascript" > var numProducts = $('.product').length; for(var i = 1;i<numProducts;i++){ var x = (i+1)/3; if(x%1=0){ alert("test1"); var box = document.getElementByClassName('product')[i-1]; alert("test2"); box.style.paddingRight ="30px"; box.style.paddingLeft="30px"; } } </script>

Obtengo los valores correctos de numProducts, i y x, por lo que no creo que sean el problema. ¿Que se supone que haga? Gracias

about 4 years ago · Juan Pablo Isaza
2 Respuestas
Responde la pregunta

0

Lo que esperaba debería ser document.getElementsByClassName en lugar de document.getElementByClassName .

about 4 years ago · Juan Pablo Isaza Denunciar

0

La siguiente es mi versión de su script. Recomendaría que realmente use jQuery, ya que claramente ya lo ha cargado. Y usar jQuery significa que algo como document.quersSelectorAll() ya no es necesario.

 $('.product').each(function(i){ i%3==2 && $(this).addClass("padded") })
 .padded {padding-right:30px; padding-left:30px;}
 <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script> <div class="product">a</div> <div class="product">b</div> <div class="product">c</div> <div class="product">d</div> <div class="product">e</div> <div class="product">f</div> <div class="product">g</div> <div class="product">h</div> <div class="product">i</div>

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda