Curso de javascript | 2. Primer programa de JavaScript

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

Crea tu primer programa JavaScript
Necesitamos la estructura habitual de un archivo HTML con el DOCTYPE, el encabezado y el cuerpo.

Para nuestro primer programa JavaScript programamos el típico programa "Hola mundo".


¿Dónde se encuentra el programa JavaScript?
El código JavaScript puede estar tanto en el área del encabezado como en el área del cuerpo (antes del cierre </body>).


Distinción entre JavaScript y HTML
El programa JavaScript está escrito entre las etiquetas HTML <script> para que el navegador sepa dónde termina HTML y comienza JavaScript.

<script type="text/javascript">
</script>

Entonces el navegador sabe qué interpretar.

Si se usa HTML5 como DOCTYPE, el atributo type="text/javascript" ya no es necesario para <script>. Sin embargo, aún se verá a menudo en programas JavaScript creados antes de HTML5. Sin embargo, el atributo no molesta si está presente. Pero más corto es mejor.

En el transcurso del curso, el atributo ya no se suele usar y, en aras de la claridad, <script> ya no se mostrará con cada ejemplo (aunque <script> es necesario).

<script>
</script>

Función de salida alert en JavaScript
Para generar nuestro texto "Hola mundo" usamos la función de alert de JavaScript. Esta función hace que aparezca una ventana con el contenido "Hola mundo" en la pantalla.

<script>
alert('Hola Mundo');
</script>

¡Asegurate de que el texto a imprimir esté entre comillas! No importa si se usan comillas simples o dobles.

Ahora nuestro primer programa JavaScript se guarda y se carga en el navegador Firefox. Obtenemos una salida.


Salida directamente en la pantalla
Si queremos escribir el texto de salida directamente en la página, hay otro comando para eso. Para ello, el área se controla a través del modelo DOM. Entonces, en la forma más simple:

<script>
document.write('Hola mundo');
</script>

Esto hace que el texto se imprima directamente en la ventana del navegador. Ahora de regreso a nuestro navegador, actualiza la página (esto volverá a ejecutar el programa JavaScript) - actualiza a través del ícono correspondiente.

Ahora obtenemos la salida "Hola mundo" en la pantalla.

Echemos un vistazo al código fuente de la página HTML: simplemente antepone lo siguiente en el campo del enlace: view-source:. No se puede ver nada en el área del cuerpo. Aquí se puede ver muy bien que JavaScript no se ejecuta en el servidor, sino en el ordenador del usuario. Por lo tanto, el área del cuerpo está vacía y la salida se "produce" en la máquina del usuario.