Propiedad target del HTML <a>

Etiqueta <a> HTML

Definición y uso

target La propiedad especifica la ubicación donde se abrirá el documento de enlace.

Ejemplo

La propiedad target especifica la ubicación donde se abrirá el documento de enlace:

<a href="https://www.codew3c.com" target="_blank">Visitar CodeW3C.com</a>

Pruebe personalmente

Sintaxis

<a target="_blank|_self|_parent|_top|framename">

target El propósito de esta propiedad es informar al navegador dónde desea que se muestre el recurso enlazado. Por defecto, el navegador utiliza la ventana, la pestaña o el cuadro (iframe) que muestra el documento actual, por lo que el nuevo documento reemplazará el documento que se muestra actualmente. Sin embargo, hay otras opciones, consulte la tabla a continuación:

Valor de la propiedad

Valor Descripción
_blank Abrir el documento de enlace en una nueva ventana o pestaña.
_self Abrir el documento de enlace en el cuadro donde se hizo clic (por defecto).
_parent Abrir el documento de enlace en el cuadro padre.
_top Abrir el documento de enlace en el cuerpo completo de la ventana.
framename Abrir el documento de enlace en el iframe especificado.

Explicación detallada

Si se incluye una propiedad target dentro de una etiqueta <a>, el navegador cargará y mostrará el documento nombrado con el atributo href de esta etiqueta, que coincide con el nombre de este objetivo, en un cuadro o ventana. Si no existe el cuadro o ventana con este nombre o id especificado, el navegador abrirá una nueva ventana, dará a esta ventana un marcador especificado y luego cargará el nuevo documento en esa ventana. A partir de ese momento, los documentos de enlace hipertexto pueden apuntar a esta nueva ventana.

Abrir nueva ventana

Los enlaces apuntados hacen que sea fácil crear herramientas de navegación eficientes. Por ejemplo, una lista simple de documentos de contenido, que puede redirigir los documentos a una ventana separada:

<h3>Índice de Contenidos</h3>
<ul>
  <li><a href="pref.html" target="view_window">Prólogo</a></li>
  <li><a href="chap1.html" target="view_window">Capítulo 1</a></li>
  <li><a href="chap2.html" target="view_window">Capítulo 2</a></li>
  <li><a href="chap3.html" target="view_window">Capítulo 3</a></li>
</ul>

Pruebe personalmente

Cuando el usuario selecciona por primera vez un enlace de la lista de contenido, el navegador abre una nueva ventana y la marca como "view_window", luego muestra el contenido del documento deseado en esta ventana. Si el usuario selecciona otro enlace de esta lista de contenido y la "view_window" aún está abierta, el navegador volverá a cargar el documento seleccionado en esa ventana, reemplazando los documentos anteriores.

Durante todo el proceso, la ventana que contiene la lista de contenido es accesible para el usuario. Al hacer clic en un enlace de la ventana, se cambia el contenido de otra ventana.

Abrir ventana en cuadro

Sin abrir una ventana de navegador completa, el uso más común de target es redirigir el contenido de un enlace en un <frameset> a uno o más cuadros. Puede poner esta lista de contenido en uno de los cuadros de un documento con dos cuadros y usar este cuadro adyacente para mostrar el documento seleccionado:

<frameset cols="100,*">
  <frame src="toc.html">
  <frame src="pref.html" name="view_frame">
</frameset>

Pruebe personalmente

Cuando el navegador muestra por primera vez estos dos cuadros, el cuadro de la izquierda contiene el índice y el cuadro de la derecha contiene el prólogo.

Este es el código fuente de "toc.html":

<h3>Índice de Contenidos</h3>
<ul>
  <li><a href="pref.html" target="view_frame">Prólogo</a></li>
  <li><a href="chap1.html" target="view_frame">Capítulo 1</a></li>
  <li><a href="chap2.html" target="view_frame">Capítulo 2</a></li>
  <li><a href="chap3.html" target="view_frame">Capítulo 3</a></li>
</ul>

Por favor, tenga en cuenta que en el documento "toc.html", cada enlace apunta a "view_frame", es decir, el cuadro de la derecha.

Cuando el usuario selecciona un enlace del índice en el cuadro de navegación de la izquierda, el navegador cargará y mostrará el documento asociado en este cuadro "view_frame" de la derecha. Cuando se selecciona otro enlace, el contenido de este cuadro de la derecha también cambiará, mientras que el cuadro de la izquierda se mantiene inmutable.

Objetivo especial

Hay 4 nombres de destino conservados para operaciones de redirección de documentos especiales:

_blank

El navegador siempre carga el documento objetivo en una nueva ventana sin nombre.

_self

Este objetivo es el valor predeterminado para todos los <a> sin objetivo especificado, hace que el documento objetivo se cargue y se muestre en el mismo cuadro o ventana que el documento de origen. Este objetivo es innecesario y redundante, a menos que se utilice junto con la propiedad target del etiqueta <base> del título del documento.

_parent

Este objetivo hace que el documento se cargue en la ventana padre o en el cuadro de la cuadrícula que contiene la referencia del hipervínculo. Si esta referencia está en una ventana o en un cuadro de nivel superior, es equivalente al objetivo _self.

_top

Este objetivo hace que el documento se cargue en la ventana que contiene este hipervínculo, si se usa el objetivo _top se limpiarán todos los marcos incluidos y el documento se cargará en toda la ventana del navegador.

Consejo:Todos los 4 valores de target de estos se inician con una subrayada. Cualquier otra ventana o objetivo que comience con una subrayada será ignorado por el navegador, por lo tanto, no use una subrayada como el primer carácter de cualquier nombre o id definido en el documento.

Compatibilidad con navegadores

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Soporte Soporte Soporte Soporte Soporte

Etiqueta <a> HTML