Como logro obtener un selector asi?

[Ex_shadow]

Hola les paso a comentar, necesito seleccionar una lista de LI dentro de una clase que esta en un UL seria asi:

<ul class="CLASE">
<li></li>
<li></li>
</ul>

Que me devuelva la lista con la cantidad de LI , en este ejemplo seria 2... y poder cambiar sus id en un for... yo lo tengo de esta manera pero me sale error :

Código Javascript:

// -- For Identificadores
    lis = document.querySelectorAll(Carrousel+' li');
    Cantidad = lis.length;
    for(i=0;i <= Cantidad; i++){
            lis[i].id = Prefijo+i;
        }
        
 
}
 

Quisiera saber como puedo imitar esta linea para obtener el array de los LI :

lis = document.querySelectorAll(Carrousel+' li');

Este es el error en la consola de chrome:

Uncaught TypeError: Cannot set property 'id' of undefined javascript.js:34
Cm_Carrousel

Esta es la linea:

lis[i].id = Prefijo+i;



Les agradeceria mucho cualquier aporte, desde ya no tengo intenciones de utilizar jquery...

[arros]

por eso tenemos la funccion find() en jquery

[hmvr414]

$("ul.CLASE").children();

[Ex_shadow]

por eso tenemos la funccion find() en jquery

$("ul.CLASE").children();

No tengo intenciones de utilizar jquery...

[arros]

pues de aqui puedes empesar

Código Javascript:

var children = document.getElementById('id').childNodes;
 

[Ex_shadow]

Iniciado por arros

pues de aqui puedes empesar

Código Javascript:

var children = document.getElementById('id').childNodes;
 

Código Javascript:

lis = document.getElementById(Carrousel).childNodes;
    Cantidad = lis.length;
    for(i=0;i <= Cantidad; i++){
            lis[i].id = Prefijo+i;
}
 

Error consola : Uncaught TypeError: Cannot set property 'id' of undefined

Código HTML:

<!-- Slider --->
<div id="Slider">
    
    <!-- Carrousel --->
    <ul class="Carrousel" id="Carrousel">
        
        <!-- Contenido --->
        <li class="Select">
            <img src="@Imagen" />
            <p>@Informacion</p>
        </li>
        
        <!-- Contenido --->
        <li>
            <img src="@Imagen" />
            <p>@Informacion</p>
        </li>
        
        <!-- Contenido --->
        <li>
            <img src="@Imagen" />
            <p>@Informacion</p>
        </li>
 
        <!-- Contenido --->
        <li>
            <img src="@Imagen" />
            <p>@Informacion</p>
        </li>
 
        <!-- Contenido --->
        <li>
            <img src="@Imagen" />
            <p>@Informacion</p>
        </li>
        
    </ul>
 
</div>
 

No funciona...

[arros]

mira este ejemplo alicalo a tu manera

Código Javascript:

var children = document.getElementById('li').getElementsByTagName('*');
$.each(children, function(e){
alert(e);
});
 

[Ex_shadow]

Perfecto, pero tengo un problema, sigue saliendo el mismo error, el proposito de este tema era solucionar ese error, ya que antes se agregaban los id, al igual que con tu codigo o el mio funcionaba... solo que todo el codigo que se situaba debajo del for dejaba de funcionar... mira te paso el script completo es basico y corto...

Código Javascript:

// --- Variables Necesarias
 
var Carrousel = 'Carrousel'; // -- Variable del ul
var Prefijo = 'Contenedor'; // -- Prefijo de los id , seran aumentados...
var Foco = 0; // -- Imagen que esta seleccionada
var Contador =0;
 
// --- Carrousel
function Cm_Carrousel(e){
    
    // -- Carrousel
    EV3_Carrousel = document.getElementById(Carrousel);
    
    // -- Evento del teclado
    Evento = e || window.event;
    Letra = Evento.keyCode;
    
    // -- Movimiento derecho
    if(Letra == 39){        
            
            document.getElementById(Prefijo+Foco).removeAttribute('class');
            
            Foco++;
            
            document.getElementById(Prefijo+Foco).setAttribute('class','Select');
            
            
    }
    
    // -- For Identificadores
        lis = document.getElementById(Carrousel).getElementsByTagName('li');
        Cantidad = lis.length;
        for(i=0;i <= Cantidad; i++){
                lis[i].id = Prefijo+i;
    }
 
}
 
window.onload = function(){
    
    document.onkeyup = Cm_Carrousel;
    
}
 

Sigue sin funcionar todo lo que valla debajo del for,pense que era por el querySelector pero por lo que veo no lo es...

los id solo se agregan al precionar una tecla cualquiera, si el for lo saco de la funcion no funciona más...por eso no comprendo ÉL PORQUE?

[furoya]

Me parece perfecto que para semejante güevada no uses yaicuery. Es un despropósito.
A menos que ya lo tengas puesto para otra cosa que sí lo justifique.

Ésta es una forma de hacerlo.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<meta http-equiv=Content-Type content="text/html; charset=utf-8">

<script type="text/javascript">

function alfa(){
var bravo = document.getElementById("Carrousel");
var charly = bravo.getElementsByTagName("li").length;

//alert("Cantidad de <li> : " + charly)

for(l=0; l<charly; l++){
bravo.getElementsByTagName("li")[l].id = "delta" + l;
}

alert(bravo.innerHTML)
}

onload=alfa;

</script>
</head>
<body>
<div id="Slider">

<!-- Carrousel --->
<ul class="Carrousel" id="Carrousel">

<!-- Contenido --->
<li class="Select">
<img src="@Imagen" />
<p>@Informacion</p>
</li>

<!-- Contenido --->
<li>
<img src="@Imagen" />
<p>@Informacion</p>
</li>

<!-- Contenido --->
<li>
<img src="@Imagen" />
<p>@Informacion</p>
</li>

<!-- Contenido --->
<li>
<img src="@Imagen" />
<p>@Informacion</p>
</li>

<!-- Contenido --->
<li>
<img src="@Imagen" />
<p>@Informacion</p>
</li>

</ul>

</div>

</body>
</html>

¿Qué ya no habías preguntado antes sobre esto?

[Ex_shadow]

Iniciado por furoya

Me parece perfecto que para semejante güevada no uses yaicuery. Es un despropósito.
A menos que ya lo tengas puesto para otra cosa que sí lo justifique.

Ésta es una forma de hacerlo.



¿Qué ya no habías preguntado antes sobre esto?

Si habia preguntado, pero era sobre otra cosa del mismo carrousel, cuando lo empese tenia más o menos la idea de como hacerlo , pero habian cosas que no me quedaban claras , y ya hice 25 veces el mismo codigo xDDD

Voy a probar tu codigo me parece más limpio que el mio, aunque medio militarizado aajajajaj Cambio. xD

[furoya]

A emprear también le hace gracia como nombro las funciones y variables. Pero ya me acostumbré, así no me pierdo.

No me había fijado que se te colgaba después del bucle; ¿no será porque tienes un <= en vez de un < ?

Hay más formas de hacer esto, pero así te evitas los malentendidos de los diferentes navegadores con respecto a quién es "hijo primogénito" de cual. Hasta que realmente se estandarice.

Y sí, ya vi. Era otra parte del proyecto. Me quedó en la cabeza lo del slide con listas.

[Ex_shadow]

Acá lo adapte a mi nesesidad xD


function Identificador(){

lis = document.querySelectorAll(Carrousel+' li');
Cantidad = lis.length;

for(i=0; i<Cantidad; i++){
lis[i].id = Prefijo+i;
}
}