¿Usa la misma ID en múltiples etiquetas HTML?

Duplicar posible:
Several elements with the same ID responding to one CSS ID selector ¿Usa la misma ID en múltiples etiquetas HTML?

A continuación se muestra el código de ejemplo que se estaba probando y se confundió. Todos dicen que podemos usar o debemos usar solo una vez por ID, pero tengo testículos que lo usan varias veces, pero me da el resultado correcto.

¿Qué debo hacer?

Es un poco de trabajo misma clase como para mí en este ejemplo

código:

<html> 
<head> 
<style> 

#exampleID1 { background-color: blue; } 
#exampleID2 { text-transform: uppercase; } 

</style> 
</head> 
<body> 
<p id="exampleID1">This paragraph has an ID name of "exampleID1" and has a blue CSS defined background.</p> 
<p id="exampleID2">This paragraph has an ID name of "exampleID2" and has had its text transformed to uppercase letters.</p> 

<address id="exampleID1"> 

Written by W3Schools.com<br /> 
<a href="mailto:[email protected]">Email us</a><br /> 
Address: Box 564, Disneyland<br /> 
Phone: +12 34 56 78 
</address> 


<blockquote id="exampleID1"> 
Here is a long quotation here is a long quotation here is a long quotation here is a long quotation here is a long quotation here is a long quotation here is a long quotation here is a long quotation here is a long quotation. 
</blockquote> 

</body> 
</html>

Vea el código de arriba y me responde que por qué no debemos usar selector de ID dos veces en una página mientras está funcionando bien.

Fuente

2012-06-18 gaurav rathor

CSS realmente no le importa si usa ID's y clases. Cuidados de Javascript. Javascript se preocupa mucho – SpaceBeers

El hecho de que pueda no significa que deba hacerlo. – BoltClock

un ID debe ser único en una página. Usa una clase si quieres describir un grupo de elementos.

por qué no debemos usar el selector de id dos veces en una página mientras funciona bien.

Comease un error y depende de cada navegador que vea la página para compensarlo. No puedes estar seguro de que todos lo harán.

Fuente

2012-06-18 09:08:02 Quentin

Y especialmente JavaScript ** ** se romperá dependiendo de lo que haga con los ID duplicados. El hecho de que solo exista un elemento con una identificación dada permite al navegador hacer todo tipo de suposiciones/optimizaciones al atravesar el árbol. – ThiefMaster

gracias por aclarar mi duda. –

que está funcionando, pero ese no es el camino identificaciones están destinados a ser utilizados (de acuerdo con las especificaciones de HTML). Una ID debe referirse solo a un objeto. La descripción de objetos múltiples se debe hacer con clase, no con id.

Fuente

2012-06-18 09:10:30 maxdec

Debe utilizar identificadores únicos para asegurar el código HTML es válido.

El razonamiento detrás de esto es simplemente que se utilizan ID para identificar elementos únicos.

La página seguirá apareciendo, a pesar de no ser válida, pero el mayor problema práctico es que JavaScript y otras bibliotecas están optimizadas para funcionar suponiendo que los ID son únicos, por lo que intenta obtener todos los elementos con un Id. ocultarlos, por ejemplo usando jQuery

$('#exampleID1').hide();

Sólo se ocultará el primer elemento, ya que para seleccionar por Id sólo debe devolver un solo elemento y una vez que se encuentra un solo elemento de la consulta es cortocircuitada a devolver el elemento individual. Sin saber esto, puede obtener un comportamiento aparentemente extraño y defectos difíciles de diagnosticar.

Fuente

2012-06-18 09:11:54 StuperUser

Pero '$ ('* # exampleID1'). Hide()' funciona. Solo una nota. – Leonid

por qué no debemos usar selector de ID dos veces en una página, mientras que su funcionando bien

Debido a que no se sabe si está funcionando muy bien en todos los navegadores.

Las especificaciones dice que una identificación tiene que ser único en la página, por lo que cuando los navegadores encontrar el ID de duplicado: s van a tratar de manejar la situación lo mejor que pueda.La mayoría de los navegadores parecen manejarlo usando la identidad solo para el primer elemento, pero dejando el atributo id en los elementos para que su CSS aún funcione, pero no hay garantía de que todos los navegadores lo manejen de esa manera.

Diferentes proveedores de navegadores utilizan diferentes tácticas para manejar el marcado incorrecto, y cada proveedor encuentra una forma "nueva, mejor", por lo que el marcado incorrecto se maneja normalmente de tantas formas diferentes como sea posible.

Fuente

2012-06-18 10:11:43 Guffa

Creo que la forma más fácil de entender es hacer una analogía con un producto. Imagine que un ID funciona como un número de serie, en otras palabras, debe ser único, de esta manera puede identificar un producto que tenga millones de copias iguales.

Entonces, imagine el class como el Código del producto, puede ser el código de barras, por ejemplo. En un supermercado, todos los productos iguales tienen el mismo código de barras para ser leídos por un lector óptico. Por ejemplo, ID es un identificador único y class agrupa un grupo de elementos.

Pero si estoy usando el mismo ID en mi HTML/CSS obtengo un resultado perfecto, ¿por qué debería preocuparme por el único ID s?

Razón número 1:

En el futuro, si es necesario utilizar Javascript y si es necesario manipular un elemento específico y tiene un duplicado ID, su código no va a generar el resultado esperado.

Razón número 2

El código no será valited por el W3C, lo que significa que se puede tener dolores de cabeza con compability de su sitio web al otro lado de los navegadores. Puede funcionar bien en un navegador y en otros no.

Usando un verdadero ejemplo, imagine que desea actualizar dinámicamente, usando Javascript, el texto de este elemento:

<blockquote id="exampleID1"> 
Here is a long quotation here is a long quotation here is a long quotation here is a long quotation here is a long quotation here is a long quotation here is a long quotation here is a long quotation here is a long quotation. 
</blockquote>

Con Javascript/jQuery va a utilizar un código como el siguiente:

$("#exampleID1").html("Changing element content");

Y luego se actualizará el texto del elemento <blockquote id="exampleID1">, pero el elemento a continuación también se actualizará, ya que tiene el mismo ID.

<p id="exampleID1">This paragraph has an ID name of "exampleID1" and has a blue CSS defined background.</p>

lo tanto, si desea actualizar sólo un elemento, deben tener únicos ID s.

Espero que pueda utilizar esta explicación para comprender mejor la diferencia entre ID y class.

Fuente

2012-06-18 12:27:11

Hola, ¿Qué pasa si estoy usando document.getElementbyId ("resultado"). Innerhtml = d; y quiero múltiples divs con id = "resultado". ¿Qué es un buen trabajo para eso? –

@KalaJ, creo que usar una clase um puede resolver esto –

¿Usa la misma ID en múltiples etiquetas HTML?

Respuesta

Cuestiones relacionadas