0
<div class="child
    <?= isset($compareMode) ? "" : "col-sm-6"; ?> 
    <?= isset($fourColumns) ? "col-lg-3" : "col-lg-3"; ?>
    <?= $filter ? (($filter != $e['tipo_bici']) ? "hidden" : "") : ""; ?> filterDiv <?php echo 
    $class_uso;?> <?php echo $class_pleg;?> <?php echo $class_incl;?> <?php echo $class_peso;?> 
    <?php echo $class_ejer;?>"

    data-orden="<?=$e['orden'];?>" data-precio="<?=$e['precioDescuento'];?>">

En el codigo de arriba, estoy generando diferentes tag's para cada uno de los productos que muestro en un listado. Lo que estoy intentando hacer, es que a partir de cierto producto pueda colocar un boton de ver mas, para luego mostrar el resto de los productos. Trate de obtener el numero de orden que se ingresa en data-orden, para despues poder usar style.display a partir de ese numero. Pero no logro obtenerlo. Este es mi javascript

    const prodnum9 = [];
prodnum9 = document.getElementsByTagName("data-orden").innerHTML;
        var prod = prodnum9;
        if (prod == "9") {
            console.log("hola");        
        }
    

1 respuesta 1

0

getElementsByTagName Busca por tag, en tu caso el tag es un div no un data-orden.

Deberías hacer algo como esto:

document.querySelectorAll('div[data-orden]').forEach(
    (el) => {
        console.log(el.getAttribute('data-orden'));
    }
);

Update (Explicación)

  1. document.querySelectorAll(x) devuelve una lista de elementos, donde x es un selector que funciona similar a los selectores de css, es decir puedes buscar por "#id", ".clase", "div", "form", etc. También es parecido Jquery si es que lo conoces. En el código yo busco a todos los div que tienen seteado el atributo "data-orden"

  2. El foreach es parecido a un for, solo que no necesitas un índice para recorrer los elementos. "el" en cada iteración toma el valor del elemento de la lista.

Es lo mismo que poner:

var elementos = document.querySelectorAll('div[data-orden]');

for(var i=0; i<elementos.length; i++){
  console.log(elementos [i].getAttribute('data-orden'));
} 
var elementos = document.querySelectorAll('div[data-orden]');

for(var el of elementos){
  console.log(el.getAttribute('data-orden'));
} 
document.querySelectorAll('div[data-orden]').forEach(

    function(el) {
        console.log(el.getAttribute('data-orden'));
    }
}
3
  • No entiendo, me explicarias tu foreach?! en (el) guardarias cada uno de los numeros de orden?
    – SebasF
    Commented el 8 sept. 2022 a las 13:32
  • @SebasF Edité la repuesta, te ayuda eso?
    – Yussef
    Commented el 8 sept. 2022 a las 16:22
  • Excelente muchas gracias @Yussef !!
    – SebasF
    Commented el 8 sept. 2022 a las 18:21

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.