-
Cómo utilizar Javascript para actualizar una página de título
-
JavaScript es un lenguaje de programación independiente del proveedor que normalmente está incrustado en páginas Web y se ejecuta en un equipo cliente. Desde JavaScript es basado en objetos, que tiene una variedad de objetos incorporados que se pueden utilizar para añadir contenido dinámico a páginas Web. Uno de estos objetos, el objeto de documento, proporciona acceso a todos los elementos en una página HTML desde el interior de JavaScript, dando a los desarrolladores la capacidad de cambiar dinámicamente los elementos del documento, como los enlaces y anclajes, así como los atributos como el color de fondo y el título de la página .Instrucciones
1 Abra un editor de texto y crear un nuevo archivo con el nombre updateTitle.html. Añadir algunas etiquetas HTML a updateTitle.html, asegurándose de incluir un <head> y una sección <body>:
<Html>
<Head> </ head>
<Body> </ body>
</ Html>
Guardar updateTitle.html.
2 Añadir una etiqueta <title> para el código HTML <head> sección. El texto del título sea: "Título de Página Antes":
<Html>
<Head>
<Title> Título de Página Antes </ title>
</ Head>
<Body> </ body>
</ Html>
3 Escriba una etiqueta guión abierto JavaScript y colocarlo dentro de la etiqueta <head>. Configurar <script> valor de tipo de etiqueta en text / javascript y cerrar la etiqueta:
<Html>
<Head>
<Title> Título de Página Antes </ title>
<Script type = "text / javascript">
</ Script>
</ Head>
<Body> </ body>
</ Html>
4 Añadir una función de JavaScript a la sección <script> del archivo. Nombre del ChangeTitle función ():
<Html>
<Head>
<Title> Título de Página Antes </ title>
<Script type = "text / javascript">
funcionar ChangeTitle ()
{
}
</ Script>
</ Head>
<Body> </ body>
</ Html>
5 Añadir un código JavaScript a la función ChangeTitle () que actualiza el título del documento utilizando la propiedad document.title. Cambiar el título a título de página después:
<Html>
<Head>
<Title> Título de Página Antes </ title>
<Script type = "text / javascript">
funcionar ChangeTitle ()
{
document.title = "Título de página después";
}
</ Script>
</ Head>
<Body> </ body>
</ Html>
6 Añadir una etiqueta <p> dentro de la etiqueta HTML <body>. Introduzca el texto que muestra el mensaje Cambiar título con JavaScript. Cierre la etiqueta </ p>:
<Html>
<Head>
<Title> Título de Página Antes </ title>
<Script type = "text / javascript">
funcionar ChangeTitle ()
{
document.title = "Título de página después";
}
</ Script>
</ Head>
<Body>
<P> Cambiar título con JavaScript </ p>
</ Body>
</ Html>
7 Añadir un botón <> para la etiqueta <body>. Añadir un evento onclick () para el botón y establecer la acción onclick () para llamar a la función de JavaScript ChangeTitle (). Introduce el texto Haga clic para cambiar el título después de que el botón <> etiqueta de apertura y cierre de la etiqueta:
<Html>
<Head>
<Title> Título de Página Antes </ title>
<Script type = "text / javascript">
funcionar ChangeTitle ()
{
document.title = "Título de página después";
}
</ Script>
</ Head>
<Body>
<P> Cambiar título con JavaScript </ p>
<Botón onclick = "ChangeTitle ()"> Haga clic para cambiar el Título </ botón>
</ Body>
</ Html>
Guarde y cierre updateTitle.html.
8 updateTitle.html abierta en un navegador Web. Haga clic en "Haga clic para cambiar el título" botón para cambiar el título de updateTitle.html del Título de página Antes de Título de página después.
Consejos y advertencias
- El título de la página es uno de los elementos más importantes en SEO (Search Engine Optimization), y títulos de las páginas de manera destacada en las páginas de resultados del motor de búsqueda. Tenga esto en cuenta al desarrollar los títulos de página.
- En repetidas ocasiones la creación de objetos pueden causar problemas de rendimiento. Si debe crear varios objetos idénticos, considere crear el objeto una vez, almacenarlo en una variable, y la referencia a la variable.
- La colocación del código JavaScript en un archivo separado y hacer referencia al archivo de código HTML dentro permite a los desarrolladores utilizar un único archivo de código en múltiples páginas. Además, esta técnica permite que varios desarrolladores utilizan el mismo archivo de código y promueve la encapsulación.
- El cambio de títulos de las páginas de forma dinámica utilizando un script del lado del cliente no alterarán los resultados de la página en los motores de búsqueda. Los motores de búsqueda utilizan el título que se codifica como parte de la página, y no son conscientes de los cambios de título dinámicas realizadas después de que se carga la página.
