Comprenda rápidamente las características y funciones de window.name

1. Todos los navegadores tienen un nombre de ventana.

window.nameEs un atributo que tienen todos los navegadores. Representa el nombre de la ventana del navegador. El valor predeterminado es una cadena vacía y todos los navegadores son una cadena vacía.

Este es un atributo que se puede leer y escribir, la sintaxis es la siguiente:

string = window.name; 
window.name = cadena ;

P.ej:

window.name = 'zhangxinxu';

En segundo lugar, las características entre páginas de window.name

window.nameHay una característica entre páginas muy interesante, que se describe en detalle de la siguiente manera: Si la página está configurada window.name, esto window.namepermanecerá incluso si la página salta a otra página .

Por ejemplo, en la siguiente demostración, puede hacer clic aquí: window.name and link address test demo

Entre ellos, hay dos hipervínculos en la página cuando se hace clic en el hipervínculo, el. Valor del atributo de la será la página actual windowestablece name:

El código HTML es el siguiente:

<a href="./window-name.html" onClick="window.name='zhangxinxu-1';"> Haga clic en el nombre de la ventana de la página de destino que veo </a> 
<a href = ". / window -name.html "onClick =" window.name = 'zhangxinxu-2'; "> Haz clic en mí para ver el window.name de la página de destino </a>

Entonces, la página window-name.html es muy simple (vea el código a continuación), que es generar el window.namevalor en este momento después de que se cargue la página .

<! - window-name.html 页面 中 的 代码 -> 
<p> window.name 值 是 ： <output id = "output"> </output> </p> 
<script> output.textContent = window. nombre; </script>

El efecto final es el siguiente:

• Haga clic en el primer vínculo para establecer la página actual window.name='zhangxinxu-1'. En este momento, la página de destino window-name.html solicita información como se muestra en la siguiente figura:

  

  El window.namevalor mostrado es 'zhangxinxu-1'.

• En este punto, regresamos a la página de origen:

  

  Haga clic en el segundo enlace:

  

  Verá que el window.namevalor de visualización de la página de destino es en este momento 'zhangxinxu-2'.

  

Esta función es muy interesante. De hecho, puede memorizar el window.namevalor establecido en la página de origen . Esto es incluso más fácil de usar que document.referrer . Después de todo, puede especificar directamente cualquier carácter y document.referrernecesita procesar la URL.

Por ejemplo, en el ejemplo anterior, la página window-name.html puede saber de qué enlace proviene y luego hacer diferentes cosas según la fuente, que es más limpia, más flexible y más secreta que pasar parámetros a través de URL.

Nueva ventana abierta window.nameno válida

windowSignifica una ventana, por <a>lo que si configuramos una target="_blank"nueva ventana para que se abra en el enlace anterior , la página de destino window.namees una cadena vacía '', porque es una nueva ventana, no la ventana que se configuró window.name.

Por lo tanto, window.nameexisten ciertas restricciones sobre la transferencia de datos entre páginas.

Tres, window.name y cross-domain y nada para usar

window.nameEl valor de está siguiendo la ventana del navegador. Por lo tanto, siempre que esté en una ventana, puede compartir un valor, de modo que pueda lograr la adquisición de datos entre dominios. Este es un método entre dominios muy conocido en el pasado, llamado "window .name Transport", si está interesado, puede consultar este antiguo artículo en 2008. No lo expandiré aquí Este método de dominio cruzado es más seguro que JSONP.

Luego, voy a hablar sobre por qué no voy a comenzar, porque ahora la window.namecomunicación entre dominios es un método de mal gusto, use la comunicación entre dominios y documentos postMessage en su lugar, es mejor usar, más seguro y más poderoso.

Desde este punto de vista, window.nameeste atributo no es muy útil ahora, excepto como se mencionó anteriormente, ocasionalmente se puede usar para una transferencia de datos simple entre las páginas frontal y posterior de la misma ventana, incluidos los datos de cadena JSON.

window.name = '{"foo": "bar"}';

Cuatro, finalmente resumir

1. window.nameLegible y escribible, se refiere a cadenas de apoyo;
2. window.nameEl valor de sigue la ventana del navegador, no la página;
3. window.nameEs inútil, saber que es inútil es un conocimiento muy útil.

De acuerdo, eso es todo, déjame averiguar window.namequé es el fantasma en la leyenda , estoy muy satisfecho.