1

Estaba haciendo un buscador de elementos en una página. Intento coger todos los elementos con la misma id, y solo me sale el primero tanto con JS como con jQuery. Se que si lo haría con clases lo podría hacer sin problemas pero me queda la duda se se podría hacer con ids.

Un saludo.

4 respuestas 4

2

Aunque lo mejor -por convención- es utilizar ids únicos, desde el contexto de un documento XML (o SGML en su defecto), el id es tan solo un atributo mas del elemento. Por lo tanto el selector de atributos es una alternativa valida tanto en javascript como en jQuery.

La sintaxis del selector de atributos es [id=valor]

Ejemplos:

console.log(document.querySelectorAll('[id=a]'));
console.log($('[id=a]'));
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="a"></div>
<div id="a"></div>
<div id="a"></div>
<div id="a"></div>
<div id="a"></div>
<div id="a"></div>

2

Tienes que tener en cuenta, que una etiqueta id y un etiqueta class no son lo mismo, y debes saber cuando utilizar una etiqueta u otra.

id es único

  • Cada elemento puede tener solamente un id asociado
  • Cada página solo puede tener un elemento con ese id

class NO es único

  • Puedes usar la misma class en múltiples elementos
  • Puede usar múltiples class sobre el mismo elemento

Ejemplo:

<div id="left-box" class="main-box dark"></div>
<div id="right-box" class="main-box light"></div>

Aunque pueda dar a confusión al principio, es fácil de recordar, solo debes pensar que class equivale a un tipo de elemento, mientras que id es el nombre que se le da.

1
  • Gracias por tu aclaración
    – Pabpereza
    Commented el 7 jun. 2016 a las 10:59
2

Si bien como te comentaron, no es recomendable tener 2 o más elementos con el mismo id, Pero si bien así lo tuvieras, podrías accesar a todos los elementos vía querySelectorAll... es decir:

document.querySelectorAll("#id");

El querySelectorAll te va a entregar un array con los registros encontrados. Veamos un ejemplo:

HTML

<input type="text" id="a" > < input type="text" id="a" > < input type="text" id="a" >

JS

var a = document.querySelectorAll("#a"); console.log(a);
1

El problema es que las especificaciones de HTML requieren que la ID sea única en cada página, pero si de verdad necesitas hacerlo, prueba iterando :

function porQueHacesEsto() {
    var n = document.getElementById("id-no-unica");
    var a = [];
    var i;
    while(n) {
        a.push(n);
        n.id = "id-diferente";
        n = document.getElementById("id-no-unica");
    }

    for(i = 0;i < a.length; ++i) {
        a[i].id = "id-no-unica";      
    }
    return a;
}

Esta respuesta está extraida de otras respuestas de stackoverflow.com

1
  • Pero lo que propones ya sería variando la id. Igualmente lo he hecho con clases, solo tenía esa duda de si se podía hacer con la misma. Gracias por la molestias, has puesto un buen ejemplo de hacerlo con ids. Un saludo.
    – Pabpereza
    Commented el 7 jun. 2016 a las 10:58

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.