Editar el estilo a varios elementos con el mismo id

[carlosgs91]

Este es el código que he hecho:

Código HTML:

<script>
function editServers(serverid,serverid2) {
var getstyle1 = document.getElementById(serverid).style.textDecoration;
if(getstyle1 == "none") { 
document.getElementById(serverid).style.textDecoration='line-through';
document.getElementById(serverid2).style.display='none';
}
else { 
document.getElementById(serverid).style.textDecoration='none';
document.getElementById(serverid2).style.display='block';
 }
}
</script>

Displaying songs from <a href="#" id="godi" onClick="editServers('godi','godi2')" style="text-decoration:none;">Goear</a>, <a href="#" id="mpdi" onClick="editServers('mpdi','mpdi2')" style="text-decoration:none;">Mp3Tube</a>, <a href="#" id="ijdi" onClick="editServers('ijdi','ijdi2')" style="text-decoration:none;">Ijigg</a>, <a href="#" id="wrdi" onClick="editServers('wrdi','wrdi2')" style="text-decoration:none;">Wrzuta</a>
<div id="godi2" style="display:block;">asd</div>
<div id="ijdi2" style="display:block;">asd213213</div>
<div id="godi2" style="display:block;">aasdsd</div> 

Quiero que al darle a goear se dejen de ver asd y aasdsd, pero con este código solo se me oculta el primero y no todos, como hacerlo?

[David]

No debes colocar varios elementos con el mismo id, el id debe ser único en el documento, mejor si lo que quieres es desactivar varios es asignar un texto + un número secuencial al id, así podrás recorrerlos con un bucle for.

[carlosgs91]

alguna otra solucion?

[the_web_saint]

Usa clases para dar estilos a varios elemntos.

Saludos

[carlosgs91]

Al final he usado el bucle for, se me habia ocurrido pero pensaba que habia alguna funcion para editar los estilos de varios elementos con el mismo id.

Así quedó: http://www.everymusic.co.cc/index.php?find=Blink+182

[carlosgs91]

Siento hacer flood pero es que pensaba que ya estaba arreglado pero no, no se porque en algunas busquedas falla, por ejemplo: http://www.everymusic.co.cc/?find=the+clash al quitar Wrzuta se quitan solo algunos.

Este es el código:

Código HTML:

<script>
function editServers(serverid,serverid2) {
var getstyle1 = document.getElementById(serverid).style.textDecoration;
if(getstyle1 == "none") { 
document.getElementById(serverid).style.textDecoration='line-through';
for (i=1;i<=100;i++) { 
    document.getElementById(serverid+i).style.display='none';
}
}
else { 
document.getElementById(serverid).style.textDecoration='none';
for (i=2;i<=100;i++) { 
    document.getElementById(serverid+i).style.display='block';
}
 }
}
</script> 

[the_web_saint]

Si estas colocando varios elementos con el mismo id, no te funcionará, para dar estilos a varios elementos usa clases, las defines class="lo_q_sea"
El id es un identificador, debe ser unico!.

salu2

[carlosgs91]

Iniciado por the_web_saint

Si estas colocando varios elementos con el mismo id, no te funcionará, para dar estilos a varios elementos usa clases, las defines class="lo_q_sea"
El id es un identificador, debe ser unico!.

salu2

No es asi, cada uno tiene uno distinto, miralo en el codigo fuente si quieres. Aun asi como hago lo que quiero hacer, ocultar una serie de elementos desordenados?

[the_web_saint]

A ver, cuando deseas ocultarlos y cuando mostrarlos, en que te basas??
A simple vista se me ocurre, que coloques dos clases, una que tenga display:none, y la otra display:block, y dependiendo de lo que desees hacer, cambias de clases los elementos!

[carlosgs91]

como cambio la clase de los elementos?

[JavierB]

Hola carlosgs91

Para cambiar la clase:

Código:

document.getElementById('tuId').className = 'otraclase';

Saludos,

[carlosgs91]

el problema es que seria algo asi:

elemento1
elemento2
elemento3
elemento4

y querria que por ejemplo el 1 y el 3 se dejasen de ver y no se su id. Hice algo casi igual que lo de las classes pero puse en vez de cambiar la class cambiar el estilo directamente que es lo mismo, pero en algunas busquedas falla y no se porque.

[JavierB]

Hola de nuevo.

Te pongo un ejemplo, adaptalo a tus necesidades:

Código PHP:

  <html>
<head>
<style type="text/css">
.clase1 {color: blue}
.clase2 {color: green}
</style>
<script type="text/javascript">
function cambiar() {
  obj = document.getElementsByTagName('div');
  for (i=0; i<arguments.length; i++)
    obj[arguments[i]].className = 'clase2';
}
</script>
</head>
<body>
<div class="clase1">uno</div>
<div class="clase1">dos</div>
<div class="clase1">tres</div>
<div class="clase1">cuatro</div>
<input type="button" onclick="cambiar(1,3)" />
</body>
</html>  
  

Saludos,

[Adler]

Hola

El problema está en ciclo. Por alguna razón, si haces un bug lo comprobarás, el valor mayor de i es 54

Suerte

[anlhp]

segun creo yo no hay que hacer ciclos ni ostia, simplemente con un buen manejo del DOM XML o HTML puedes lograr lo que quieras, aqui te pongo lo que que lei que pusistes que querias, que al dar click en que se yo, desapareciera el primero y ultimo div de la lista, no vi ni el codigo porque no tengo deseos :P

pues nada, aqui te dejo algo, este la via menos eficiente, pero la que mas rapido me funciona y con menos modificacion a tu codigo, la otra seria usando el DOM XML puro y
duro, pero bueno, si ya quieres que te eche el cable con mas detalle me dices:

Código HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head>
<script>

function hide(){

var oDivs = document.getElementsByTagName('div');
oDivs[0].style.display = (oDivs[0].style.display == 'none')?'block':'none';
oDivs[oDivs.length - 1].style.display = (oDivs[oDivs.length - 1].style.display == 'none')?'block':'none';

}
</script>
</head>

<body>
Displaying songs from 
<!-- este es el unico cambio que hice aparte del script y de los id == -->
<a href="#" id="godi" onClick="hide()" style="text-decoration:none;">Goear</a>,

 <a href="#" id="mpdi" onClick="editServers('mpdi','mpdi2')" style="text-decoration:none;">Mp3Tube</a>, <a href="#" id="ijdi" onClick="editServers('ijdi','ijdi2')" style="text-decoration:none;">Ijigg</a>, <a href="#" id="wrdi" onClick="editServers('wrdi','wrdi2')" style="text-decoration:none;">Wrzuta</a>
<div style="display:block;">asd</div>
<div style="display:block;">asd213213</div>
<div style="display:block;">aasdsd</div>
</body>
</html> 

si todo esto te sirve de algo fenomenal, si no, olvida que lo puse :P

enjoy ;)

[buzu]

no, no, no.... el chico necesita explicar bien que es lo que quiere por que no entiendo nada.

si quieres desaparecer un elemento necesitas sabe que elemento quieres desaparecer, es decir su id o ya por lo menos su posicion en el DOM o ya muy muy jodido su contenido....

Que quieres lograr?

[buzu]

por cierto, no sabes que los que estás haciendo es ilegal?

Por puro sentido humanitario y amor a mi madre no participo y eh negado ayuda a demasiadas paginas para adultos en las que se expone a las mujeres como objetos sexuales mas que como seres humanos. Ahora me pregunto, deberíamos tomar la misma posición en canto a sitios ilegales?

Hasta que punto somos responsables por el funcionamiento de un sitio con contenido ilegal cuando ayudamos a su construcción?

[anlhp]

jojo!!!! no tuve ni la delicadeza de ver de que trataba to esto, carlos91, sublime tu pagina para lo que necesites de ayuda, aqui tienes a un humilde servidor pues al final todos tenemos algo de

asi que, rock n roll & downloading!!!!

[carlosgs91]

buzu, no conoces la ley española, no? es legal -> http://es.wikipedia.org/wiki/Derecho...da#Espa.C3.B1a

Haber, igual no me explico bien, el caso es este, en la pagina que se buscan canciones lo que quiero es que al darle al servidor por ejemplo de Goear se oculten todas las canciones de ese servidor y al vovler a darle que se pongan y asi con el resto de servidores.

Iniciado por Adler

Hola

El problema está en ciclo. Por alguna razón, si haces un bug lo comprobarás, el valor mayor de i es 54

Suerte

¿Por qué dices que el valor mayor de i es 54? http://everymusic.co.cc/?find=a&Submit=Search funciona ahí con 400 canciones y no en http://everymusic.co.cc/?find=green+day&Submit=Search con 232, no se que es lo que falla!!!!!!!!!!

[anlhp]

pues entonces yo lo que haria seria, cada cancion la envuelvo con un <div /> o mas bien <span /> porque contiene texto que se muestra 'in-line' y no en bloque, o en cualquier otra cosa que mas roña te de para envolverlo, le pones como atributo 'name', es decir, algo asi:

Código HTML:

...
<span name="goear">Van Halen - Humans Beings</span>
<span name="smash">Guns N Roses - Night Train</span>
<span name="goear">Pink Floyd - Poles Apart</span>
<span name="goear">Scott Henderson - Tribal Tech</span>
...

y asi como te dije anteriormente >X(

Código HTML:

function hide(serverName){

var oDivs = document.getElementsByName(serverName);
/* y aqui si lo mejor es usar un bucle jeje :) */

for(var i = 0; i < oDivs.length; i++)
  oDivs[i].style.display = (oDivs[i].style.display == 'none')?'block':'none';


}
</script>
</head>

<body>
Displaying songs from 
<a href="#" id="godi" onClick="hide('Goear')" style="text-decoration:none;">Goear</a> 

especifico, antes asegurate de ponerles a todos tus tags envolventes de canciones style="display: block", porque si no cuando uses la funcion te dira que el atributo ese no esta definido y ya sabes lo que pasa...

[carlosgs91]

Funciona perfecto anlhp, lo que no entiendo es por que el mio fallaba a veces...

Muchas gracias.

[anlhp]

pues ni idea macho, yo la verdad que no he mirado ningun codigo de los que han puesto, pero que eso es lo malo que tiene javascript, es dolor de muelas a la hora de debuggear, hay cosas que te halas los pelos y no le encuentras sentido por ningun lado, por ejemplo, ayer copie un codigo que tenia hecho y que funcionaba a la perfeccion, y lo pase a otro lado pero cambiando solo las llamadas desde las etiquetas html, y google chrome, y mozilla, todos y cada uno me decia que al nodo que trataba de acceder no tenia tal metodo, vamos, que por poco me vuelvo loco, y era que al copiar y pegar una zona en el codigo html, de alguna manera me inserto tabuladores y espacios en blancos, y resulta que mozilla, y por lo que veo chrome tambien, consideran como nodo de texto cualquier espacio entre etiquetas, y claro, ahi el problema, por eso te digo, cuando estes en problemas, utiliza creo yo, que la mejor herramienta de debug que tiene javascript: alert() ; pues si, cuando encuentres un punto oscuro en tu codigo, empieza a meter alert() a todo, elementos, propiedades, lo que sea, y al final seguro que encuentras el tan jodido bicho ( o bug jeje)
;)

[buzu]

WOW... eso no lo sabia... Me quieres decir entonces que yo (si viviera en España) puedo comprar un CD hacer un millón de copias y salir por la calle gritando "No compres el CD de Nach, yo te lo regalo". Entonces nach podría vender solo una copia pero toda España tener su CD. No pone eso en peligro el negocio de las disqueras? Bueno, no se. Solo pensando el voz alta...

En cuanto a tu problema, ya que s legal lo que haces... vamos adelante. Para hacer lo que quieres bastará con darle una clase diferente a cada enlace según sea el caso, teniendo como resultado que los enlaces pertenecientes a Goear tendrían como class goear. Al final asignas una función al evento click del enlace de goear la cual busque y oculte todos los enlaces con class='goear'; sencillo...

[buzu]

sin embargo, aun está esta linea:

Iniciado por wikipedia

la copia no sea utilizada con fines colectivos

Me pregunto yo, que no es ese un fin colectivo?

Y luego:

Iniciado por wikipedia

En este punto, la modificación de la LPI que ha introducido la Ley 23/2006 obliga ya a que las copias privadas sean realizadas a partir de obras a las que se haya accedido lícitamente, regulando al mismo tiempo el derecho de puesta a disposición que se recogía en la Directiva 2001/29/CE. De esta forma y según la nueva ley, subir un archivo a través de una red P2P constituiría un acto de puesta a disposición, mientras que descargarlo conllevaría una reproducción. Además, es importante distinguir el ilícito civil del penal; compartir una obra por una red P2P puede no constituir un delito según el artículo 270 del Código Penal por no reunir los elementos del tipo, lo que no quiere decir que no pueda ser considerado un ilícito civil, según lo establecido en la Ley de Propiedad Intelectual.

Es obvio que el mundo se dirige sin frenos a lo "abierto". Pero aun hay que esperar. Por el momento ya tenemos opensource y yo conozco de por lo menos un cantante que saca discos con copyleft, el CC no es la excepción. Veremos que pasa en el futuro. Pero esto ya es otro tema...