Etiquetas link y script

Información Adicional

No existe información adicional para este video tutorial.

Transcripción

Bienvenido a este nuevo video, mi nombre es José Lievano y en este video aprenderemos más etiquetas que nos permiten añadir elementos en nuestra página web.
Hablaremos en primer lugar de la etiqueta link
Añadimos nuestra primera etiqueta link dentro de la etiqueta head, en lugar de colocarlo en la etiqueta body como los elementos que hemos visto en los últimos videos
La etiqueta link no es lo mismo que la etiqueta anchor, esta etiqueta no creará ningún tipo de link que el usuario pueda clicar, por ello lo colocamos dentro de la etiqueta head y no dentro del body
Ya que todo lo que se encuentra en el body es lo que el navegador muestra al visitante
Entonces la etiqueta link, es completamente diferente a la etiqueta anchor
Esta etiqueta te permite añadir más elementos dentro de tu página HTML
Vamos a escribir algunos atributos dentro de nuestra etiqueta link para que podamos observar de que estamos hablando
Primero colocaré el atributo relative, se escribe colocando rel, luego colocamos el símbolo de igual y entre comillas el tipo de elemento, que este caso será una hoja de estilo así que colocamos stylesheet
Luego colocamos el tipo, escribimos type, el valor será text pleca css
Y luego colocamos un href hacia estilos.css
Y hemos terminado nuestra etiqueta, ahora, en este momento esta etiqueta no nos servirá de mucho, ya que aún no aprendemos como usar CSS dentro de nuestro documento HTML
Como podrás adivinar esta etiqueta será muy importante cuando entremos al curso de CSS, donde aprenderemos como combinar nuestros documentos HTML y CSS
Si entras en el navegador, podrás ver que no hay nada diferente en el documento, o al menos nada que pueda ver el usuario
Eso se debe a que todo lo que el usuario puede ver, o lo que el navegador renderiza debe encontrarse dentro de la etiqueta body
La siguiente etiqueta que aprenderemos es la etiqueta Script, la cual es muy similar a la etiqueta link, excepto que script se usa para añadir código Javascript
Javascript es un lenguaje de programación que puede ser ejecutado por el navegador y es algo en lo que desearas profundizar luego
Pero vamos a ver cómo funciona esta etiqueta para familiarizarnos con ella desde este momento
Así que colocamos la etiqueta script, dentro añadimos el atributo type y como valor colocamos text, pleca javascript
Y colocamos el atributo source con src y como valor diremos que el documento que deseamos vincular se encuentra en script pleca javascript.js
Y a diferencia de la etiqueta link, para la etiqueta script necesitamos crear una etiqueta de cierre
Como puedes observar al igual que con la etiqueta link tenemos el atributo type, el cual indica que tipo de elemento y es, y tenemos la etiqueta source que funciona básicamente de la misma forma que el href en la etiqueta link
Ahora, con la etiqueta script, también podemos colocar el código javascript directamente en nuestro HTML, claro entre la etiqueta de apertura y cierre de la etiqueta script
De modo que en lugar de llamar el código javascript desde un archivo externos con el atributo source podemos añadirlo directamente en nuestro código HTML.
Ahora, es mucho mejor llamar el código javascript desde un archivo externo,  pero en caso de que lo necesites también tienes la opción de añadirlo directamente en la página
Para mostrar esto vamos a escribir nuestra primera línea de código javascript
Así que borramos el atributo source y luego escribimos abajo alert colocamos paréntesis y luego un punto y coma
Y dentro de los paréntesis colocamos comillas simples y dentro de las comillas colocamos un mensaje
Vamos a colocar Hola mundo
Entonces, cualquier cosa que coloques dentro de las comillas va poder ser visto por el usuario desde el navegador en una caja llamada alert box
Así que vamos a guardar nuestros cambios y vamos al navegador
Y al refrescar la página podremos ver la caja con nuestro mensaje
Entonces, como puedes observar es posible añadir javascript dentro de nuestro documento HTML si usamos la etiqueta script
Podemos añadir nuestro código javascript dentro de esta etiqueta para que el navegador lo ejecute
Pero aprenderemos más sobre javascript en futuros videos
Este es el final de este video, en el siguiente video hablaremos sobre iframes y también sobre añadir comentarios en nuestro documento HTML
Mi nombre es José Liévano y nos veremos en el siguiente vídeo.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

¿Quieres aprender a crear sitios web?

Regístrate gratis como estudiante y aprende a crear sitios web sorprendentes. Gana certificados y medallas al completar los cursos gratuitos.
¡REGÍSTRATE GRATIS!
close-link
Crea tu sitio web con diseño profesional en menos de 15 minutos
Ver Tutorial
close-image