JavaScript es un poderoso lenguaje de secuencias de comandos que se ejecuta en el navegador, permitiéndonos manipular el contenido y el comportamiento de la página web. Al compararlo con una casa, JavaScript funciona como la funcionalidad de la casa, abarcando elementos como sistemas eléctricos, fontanería, automatización del hogar y calefacción central; esencialmente, cualquier cosa que proporcione funcionalidad.

Aquí está cómo podemos agregar JavaScript al documento HTML:

JavaScript Inline

Podemos incluir JavaScript directamente dentro del documento HTML usando la etiqueta <script>. Este método es útil para agregar scripts rápidos y únicos.

Ejemplo:

Por favor, haz clic en el botón Click Me a continuación.

JavaScript Externo

Para scripts más grandes o cuando queremos reutilizar código en varias páginas, es común usar archivos JavaScript externos. Crea un archivo JavaScript separado (por ejemplo, index.js) y enlázalo al documento HTML usando la etiqueta <script>.

Ejemplo:

Por favor, asegúrate de revisar los tres archivos en el ejemplo proporcionado.

Conceptos Básicos de JavaScript

JavaScript nos permite agregar interactividad y comportamiento dinámico a las páginas web. Aquí hay algunos conceptos básicos:

Variables

Las variables se utilizan para almacenar valores de datos. Podemos declarar variables usando las palabras clave let o const.

let age = 30;
const name = "Peter";

Funciones

Las funciones son bloques de código reutilizables que realizan una tarea específica. Podemos definir funciones usando la palabra clave function.

function greet() {
  alert('Hello, World!');
}

Manipulación del DOM

El Modelo de Objeto de Documento (DOM) representa la estructura de una página web. JavaScript nos permite manipular el DOM para cambiar el contenido y el comportamiento de la página web dinámicamente.

document.getElementById('myElement').innerHTML = 'New Content';

Sentencias Condicionales

Las sentencias condicionales nos permiten ejecutar diferentes bloques de código basados en condiciones especificadas.

if (age >= 21) {
  alert('You are an adult.');
} else {
  alert('You are a minor.');
}

Tutorial en Video