elementos con el mismo id

jasamestica · #1 (**permalink**) 13/05/2009, 16:28

como accedo a los elementos que tiene el mismo id, por ejemplo

Imagen 1<IMG src='imagen1.gif' id="Cajas">
Imagen 2<<IMG src='imagen2'.gif id="Cajas">
Imagen 3<<IMG src='imagen3'.gif id="Cajas">

caricatos · #2 (**permalink**) 13/05/2009, 16:33

Hola:

Los id's deben ser únicos... si quieres complicarte con elementos con el mismo nombre puedes usar el atributo name...

Saludos

jasamestica · #3 (**permalink**) 13/05/2009, 16:41

gracias pero me podrias dar un ejemplo cortito

pato12 · #4 (**permalink**) 13/05/2009, 16:54

Hola,
Aqui tienes un ejemplo:

Código javascript:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin t&iacute;tulo</title>
<script type="text/javascript">
<!--
onload=function(){
    var cajas=document.getElementsByName("Cajas");
    for(var i=0; i<cajas.length; i++){
        alert("Caja "+(i+1)+", imagen: "+cajas[i].src);
    }
}
-->
</script>
</head>
 
<body>
Imagen 1<IMG src='imagen1.gif' name="Cajas">
Imagen 2<IMG src='imagen2.gif' name="Cajas">
Imagen 3<IMG src='imagen3.gif' name="Cajas">
</body>
</html>

Suerte
Salu2

jasamestica · #5 (**permalink**) 13/05/2009, 17:05

Gracias,siempre lo he dicho este foro es el mejor de habla hispana

ben_rivero · #6 (**permalink**) 13/05/2009, 17:07

Segun la W3C no se pueden (no se debe) definir objetos con el mismo ID.

Lo mas recomendable y sano es usar el atributo class

Newbie001 · #7 (**permalink**) 13/05/2009, 17:10

Cita:

Iniciado por ben_rivero

Segun la W3C no se pueden (no se debe) definir objetos con el mismo ID.

Lo mas recomendable y sano es usar el atributo class

y cuando tengo un metodo en java que utiliza getElementById, y se precisa que mas de un elemento sea afectado por este metodo. Esta bien utilizar name? existe un getElementByName? o cual seria la mejor forma?
por que probe ("invente") getElementByClass pero no parece existir, y no encontro forma de lograr lo que deseo sin duplicar metodos. gracias

pato12 · #8 (**permalink**) 13/05/2009, 17:16

El getElementsByName si existe, pero el getElementByClass no. Para eso hay que crearlo, no es tan dificil.

ben_rivero · #9 (**permalink**) 13/05/2009, 17:20

Asi se hace, solo que sería usando el framework mootools (es el que yo uso)

digamos que tienes:

Código HTML:

<a href="#" class="links">Link 1</a>
<a href="#" class="links">Link 2</a>
<a href="#" class="links">Link 3</a>

Ahora bien puedes hacer esto... recorrer con each cada uno de los objetos con clase links y hacer lo que quieras con el.

Código PHP:

  $$('.links').each( function(el){ 
      //cada objeto link cae temporalmente en cada ciclo en la variable "el". en este caso cambio el color de fuente. 
      el.setStyle('color', '#ff3300');             
});

Se puede hacer con cualquier libreria, a mi me encanta mootools

pato12 · #10 (**permalink**) 13/05/2009, 17:41

Haci se lo pude hacer sin mootools:

Código javascript:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>getElementByClass</title>
<script type="text/javascript">
<!--
function getElementByClass(classNameBusca){
    var classTemp=[];
    var tags=document.getElementsByTagName('*');
    for (var i=0; i<tags.length; i++){
    if (tags[i].className==classNameBusca)
        classTemp[classTemp.length==0?0:classTemp.length]=tags[i];
    }
    return classTemp;
}
onload=function(){
    var busca=getElementByClass('dived');
    for(var i=0; i<busca.length;i++){
        busca[i].onclick=function(){this.style.color='#FFFF00';};
    }
    alert('Hay '+busca.length+' de dived en esta pagina.');
};
-->
</script>
 
</head>
 
<body>
<div class="dived">Texto 1</div>
<div class="dived">Texto 2</div>
<div class="dived">Texto 3</div>
<div>Texto 4 (no dived)</div>
</body>
</html>

Pero siempre me gusto usar framework ( mi favorito jQuery).

Newbie001 · #11 (**permalink**) 15/05/2009, 10:50

Cita:

Iniciado por pato12

El getElementsByName si existe, pero el getElementByClass no. Para eso hay que crearlo, no es tan dificil.

y funciona en todos los navegadores?
gracias por la respuesta

buzu · #12 (**permalink**) 15/05/2009, 11:49

Si, además ni hay que crearlo, solo pones en google getElementsByClassName y te da una lista enorme de funciones que ya han sido creadas. La mayoría son iguales, o por lo menos la idea detrás de ellos es igual.