Want to create interactive content? It’s easy in Genially!

Reuse this genially

Introducción a JavaScript

Stanley Rivas

Created on November 13, 2023

Start designing with a free template

Discover more than 1500 professional designs like these:

Smart Presentation

Practical Presentation

Essential Presentation

Akihabara Presentation

Pastel Color Presentation

Terrazzo Presentation

Visual Presentation

Transcript

Introducción a JavaScript

Diseño Web Adaptable por: Ingeniero Nestor Rivas

Empezar

Resumen

HTML da sentido y estructura al contenido web y define los párrafos, las tablas, las imágenes y los vídeos. CSS aplica estilo al contenido HTML coloreando los fondos y las tipografías; es decir, lo hace llamativo para el usuario.

Los estándares de Tecnologías Web más conocidos son HTML y CSS, JavaScript también es uno de ellos y se complementan entre sí de la siguiente manera:JavaScript sirve para crear contenido nuevo y dinámico, así como imágenes animadas, o para controlar ficheros multimedia.

Nota: Para crear contenido web de calidad es necesario utilizar los tres juntos.

Dónde se ejecuta...

El lenguaje JavaScript se ejecuta en el motor del navegador, después de que los códigos HTML y CSS se hayan juntado en la página web. De esta manera, se asegura que tanto el estilo como la estructura de la página están en el sitio correcto cuando JavaScript comienza a ejecutarse.

+ info

¿Qué es JavaScript?

Javascript es un lenguaje con muchas posibilidades, utilizado para crear pequeños programas que luego son insertados en una página web y en programas más grandes, orientados a objetos mucho más complejos. Con Javascript podemos crear diferentes efectos e interactuar con nuestros usuarios. Es necesario resaltar que hay dos tipos de JavaScript: por un lado está el que se ejecuta en el cliente, este es el Javascript propiamente dicho, aunque técnicamente se denomina Navigator JavaScript. Pero también existe un Javascript que se ejecuta en el servidor, es más reciente y se denomina LiveWire Javascript.

¡Demuestra entusiasmo! Respira hondo y continúa con lo que has venido a hacer.

Su sintaxis es similar a la usada en Java y C, al ser un lenguaje del lado del cliente este es interpretado por el navegador, no se necesita tener instalado ningún Framework. Variables, Condiciones, Ciclos, Arreglos, Funciones: Propias del lenguaje y predefinidas por los usuarios Comentarios para una sola línea, y de bloque: // Comentarios /*Comentarios*/ Permite la programación orientada a objetos: document.write("Hola"); Las variables pueden ser definidas como: string, integer, flota, bolean simplemente utilizando “var”. Podemos usar “+” para concatenar cadenas y variables.

Algunas características de JavaScript

Sintaxis

HTML <script> Tag

La etiqueta HTML <script> la utilizamos para definir un script del lado del cliente (JavaScript). El elemento <script> contiene sentencias de script o apunta a un archivo de script externo a través del atributo src.Entre los usos comunes de JavaScript están: la manipulación de imágenes, la validación de formularios y los cambios dinámicos de contenido.Si deseamos seleccionar un elemento HTML, JavaScript utiliza con mayor frecuencia el método document.getElementById().

Ejemplo

Nos muestra la salida en el navegador, así:

En cualquier estructura HMTL es sencillo declarar un script de JavaScript de manera funcional, recordando que debe seguir un orden, ya que primero se debe ejecutar todos los elementos de mi sitio web, seguidamente el código JavaScript con las respectivas funcionalidades para la interacción de las páginas web, o sitios web.

Ejemplo 1

Ejemplo 2

Diferencias...

En la imagen 1, se puede apreciar que la declaración del Script se há hecho de manera interna, a diferencia de la imagen 2; su declaración se ha hecho de manera externa.

  • Es recomendable hacer dichas declaraciones como se muestra en la imagen 2, debido a que podemos crear demasiado código que al final no se mire, ni se lea de manera ordenada, lo cual dificulta su comprensión asimismo como su estética del código fuente. Aunque ambos tengan la misma salida. Uma ventana emergente, como se muestra em la siguiente imagen.

¡Recuerda practicar!

GRACIAS POR LA ATENCIÓN

También se encuentra disponible para insertar códigos en las páginas, tales como:

  • Reloj
  • Contadores de visitas
  • Fechas
  • Calculadoras
  • Validadores de formulários
  • Detectores de navegadores e idiomas.

¿Dónde encuentro funcionando Javascript?

  • Correo
  • Chat
  • Buscadores de Información