html - español - ¿Por qué las etiquetas ancla anidadas son ilegales?
la declaración<! doctype html define (3)
La especificación para <a> tiene un modelo de contenido de:
Transparente, pero no debe haber descendiente de contenido interactivo .
Entonces, la especificación es realmente más complicada de lo que dices. Esto también se aplica a <button> : esencialmente no puedes tener enlaces que funcionen dentro de los enlaces o botones dentro de los botones.
Lamentablemente, no tengo una respuesta contundente a su pregunta: solo puedo especular. Una razón clara es la ambigüedad que causa (por ejemplo, ¿qué anclaje se debe seguir cuando se hace clic en el interno?)
Esto crea no solo ambigüedad funcional, sino también ambigüedad semántica. El contenido de <a> es una etiqueta para su hipervínculo. Entonces, ¿esto significa que el hipervínculo interno es parte de la etiqueta del contenido del enlace externo?
Aprendí que las etiquetas de anclaje anidadas no son compatibles con los estándares HTML.
De W3:
Los enlaces y anclas definidos por el elemento A no deben estar anidados; un elemento A no debe contener ningún otro elemento A.
Como la DTD define que el elemento LINK está vacío, los elementos LINK tampoco pueden anidarse.
Parecería que alternativas como las sugeridas en la respuesta seleccionada en esta pregunta tendrían más posibilidades de crear un comportamiento inesperado que el simple anidamiento de los anclajes.
También parece exagerado hacer que los manejadores de eventos onclick solo redirijan la página en JS. Sin mencionar el uso de una solución de script podría causar problemas para los usuarios que navegan con scripts desactivados.
EDITAR
Lo que es interesante es que estaba trabajando en un fiddle para demostrar y había pasado por alto que Chrome realmente estaba reestructurando el DOM como tal:
<div id="container">
<a href="http://yahoo.com"></a>
<div class="parent">
<a href="http://yahoo.com">Parent Element</a>
<a href="http://google.com">
<div class="child">Child Element</div>
</a>
<a href="http://bing.com">
<div class="child">Other Child</div>
</a>
</div>
</div>
Pasé por alto esto porque vi que el vuelo estacionario funcionaba y tenía el mouse sobre el texto. Saberlo ahora no necesariamente cambia mi pregunta, pero sí ilustra que ni siquiera funciona de la manera que yo pensaba.
La anidación de anclaje no es recomendada por los estándares (aunque todos los navegadores en los que lo probé parecen llevar al objetivo de clic más interno) debido a la ambigüedad.
No es lógico decir que una gran parte debería conducir a una determinada página y en esta parte una pequeña sección debería conducir a otra parte. Todavía tengo que ver cualquier caso de uso para este tipo de comportamiento. Con la evolución de los lenguajes de scripting disponibles, este tipo de iteración o herencia puede funcionar (javascript click events en divs, por ejemplo), pero nunca un código querrá dirigir a una determinada URL y luego a otra (href de anclaje padre).
Editar: Al ver la pregunta que mencionaste en el tuyo, apilar 2 anclajes que apuntan a la misma href es completamente inútil. Solo elimina el anidado y todo va a estar bien. Si es porque hiciste una regla de CSS como aa{color:red;} utiliza un lapso de tiempo. O incluso un div con display:inline pero por favor, bonito, un anclaje debe ir a algún lado, no debe usarse solo para un propósito de diseño o algo así.
Tenga en cuenta que un anclaje no es solo un enlace, sino que también es algo a lo que se puede vincular. (Aunque el uso anterior es mucho más común que el último.) Citando W3C (antiguo, pero relevante):
Un ancla es una pieza de texto que marca el comienzo y / o el final de un enlace de hipertexto.
Con ese fin, no piense en un ancla como un enlace. Piense en ello como un punto en el documento que se conecta a (y / o desde) otro punto (en el mismo documento u otro documento, no hace ninguna diferencia). Dos puntos en un espacio no físico que están conectados por un hilo no físico.
Dado que, los anclajes no deben contener mucho contenido. Si contiene mucho contenido, deja de ser un "punto" y comienza a convertirse en un "área". Por ejemplo, imagine un anclaje que, cuando se representa, ocupe más espacio de lo que el navegador puede mostrar a la vez. Si algo enlaza con ese ancla, ¿a dónde debería ir? ¿El principio? ¿Medio? ¿Fin? (Intuitivamente, podrías pensar el comienzo, pero entiendes la idea).
Además, los anclajes definitivamente no deberían contener otros anclajes. Las conexiones no físicas entre los puntos no físicos pueden volverse ambiguas. ¿El anclaje del niño se conecta con el otro punto o el ancla principal se conecta con el otro punto? Esto probablemente no resulte ser un gran problema en la mayoría de los casos, ya que la gran mayoría de los presentadores actuales son enlaces de sentido único desde el ancla hasta otro documento. Pero el propósito del anclaje es más que un simple enlace de ida a otro documento, por lo que la definición continúa encarnando ese propósito.