El lenguaje de marcado HTML (lenguaje de marcado de hipertexto) es la columna vertebral de cualquier sitio web o aplicación web. Proporciona la estructura básica, que luego se mejora y modifica mediante CSS y JavaScript. Comprender HTML es crucial para cualquier desarrollador front-end. En este capítulo, exploraremos la estructura básica de HTML, sus etiquetas y atributos, y también profundizaremos en los operadores de JavaScript.
Estructura básica de HTML
Un documento HTML está estructurado como un árbol, con un elemento 'html' en la parte superior. Este elemento contiene dos elementos secundarios: 'cabeza' y 'cuerpo'. El elemento 'head' contiene metadatos sobre el documento, incluido el título que aparece en la pestaña del navegador y enlaces a archivos CSS. El elemento 'cuerpo' contiene el contenido principal del sitio web, incluidos texto, imágenes, vídeos y enlaces.
<html>
<cabeza>
<title>Título del sitio</title>
</cabeza>
<cuerpo>
El contenido del sitio va aquí.
</cuerpo>
</html>
Etiquetas y atributos HTML
Las etiquetas HTML se utilizan para definir elementos y contenido de un sitio web. Cada etiqueta comienza con un corchete angular (<) y termina con un corchete angular (>). Las etiquetas suelen venir en pares, con una etiqueta de apertura y una etiqueta de cierre. La etiqueta de cierre es idéntica a la etiqueta de apertura, pero tiene una barra diagonal (/) antes del nombre de la etiqueta.
Los atributos HTML se utilizan para proporcionar información adicional sobre un elemento. Siempre se especifican en la etiqueta de apertura y normalmente vienen en pares nombre-valor. Por ejemplo, la etiqueta 'img' utiliza el atributo 'src' para especificar la URL de la imagen y el atributo 'alt' para proporcionar texto alternativo para la imagen.
<img src="url_da_imagem.jpg" alt="Descripción de la imagen">
Operadores de JavaScript
JavaScript es un lenguaje de programación que le permite agregar interactividad y funcionalidad compleja a un sitio web. Los operadores son símbolos que especifican qué operación realizar. Hay varios tipos de operadores en JavaScript, incluidos operadores aritméticos, de asignación, de comparación, lógicos y de tipo.
Los operadores aritméticos se utilizan para realizar operaciones matemáticas. Por ejemplo, '+' se usa para suma, '-' para resta, '*' para multiplicación, '/' para división y '%' para obtener el resto de una división.
sea x = 10; sea y = 5; consola.log(x + y); // 15 consola.log(x - y); // 5 consola.log(x * y); // 50 consola.log(x/y); // dos console.log(x % y); // 0
Los operadores de asignación se utilizan para asignar valores a variables. El operador '=" es el más común, pero hay muchos otros, incluidos '+=' y '-=', que suman o restan un valor de una variable y luego asignan el resultado a la variable.
sea x = 10; x += 5; // x ahora es 15 x-= 3; // x ahora es 12
Los operadores de comparación se utilizan para comparar dos valores. Devuelven un valor booleano: verdadero si la comparación es verdadera, falso si es falsa. Algunos ejemplos incluyen '==' (igual a), '!=' (diferente a), '<' (menos que), '>' (mayor que), '<=' (menor o igual que) y '>=' (mayor o igual que).
sea x = 10; sea y = 5; console.log(x == y); // FALSO console.log(x!= y); // verdadero console.log(x < y); // FALSO console.log(x > y); // verdadero console.log(x <= y); // FALSO console.log(x >= y); // verdadero
Los operadores lógicos se utilizan para probar varias condiciones. Incluyen '&&' (y), '||' (o y '!' (no).
sea x = 10; sea y = 5; sea z = 20; console.log(x > y && x < z); // verdadero console.log(x > y || x > z); // verdadero console.log(!(x > y)); // FALSO
Los operadores de tipo se utilizan para determinar el tipo de un valor o convertir un valor de un tipo a otro. El operador 'typeof' devuelve el tipo de un valor y el operador 'instanceof' comprueba si un objeto es una instancia de un tipo específico.
let x = "¡Hola mundo!";
let y = new String("¡Hola mundo!");
console.log(tipo de x); // "cadena"
console.log(tipo de y); // "objeto"
console.log(y instanciade String); // verdadero
En resumen, HTML, CSS y JavaScript son las tres tecnologías fundamentales para el desarrollo web. Dominar estas habilidades es esencial para convertirse en un desarrollador front-end eficaz. Esperamos que este capítulo haya proporcionado una sólida introducción a los operadores HTML y JavaScript.
