Semana 3: Introducción a
JavaScript y jQuery
Created @February 1, 2025 10:45 AM
Tags
Sesión 5: Fundamentos de Javascript
Qué es JavaScript?
JavaScript es un lenguaje de programación interpretado, de alto nivel y orientado
a objetos basado en prototipos. Se utiliza principalmente para el desarrollo web
del lado del cliente, aunque también es empleado en el lado del servidor mediante
tecnologías como [Link].
Es uno de los tres lenguajes fundamentales del desarrollo web:
HTML: Define la estructura del contenido de la página.
CSS: Se encarga del diseño y la presentación visual.
JavaScript: Agrega interactividad y dinamismo a la página.
Semana 3: Introducción a JavaScript y jQuery 1
Historia y evolución de JavaScript
Creado en 1995 por Brendan Eich en Netscape.
En 1997, se estandarizó como ECMAScript (ES).
Con el tiempo, ha evolucionado con nuevas versiones como ES6 (2015),
introduciendo características modernas como let , const , funciones flecha y
clases.
Sintaxis y Conceptos Básicos
Variables y Tipos de Datos
JavaScript utiliza tres formas principales de declarar variables:
1. var (obsoleto, evita su uso) 🚫
2. let (para variables que pueden cambiar) ✅
3. const (para valores constantes) ✅
Semana 3: Introducción a JavaScript y jQuery 2
let nombre = "Juan"; // String
const edad = 25; // Número
let esEstudiante = true; // Booleano
let precio = 199.99; // Número decimal
let lista = ["HTML", "CSS", "JavaScript"]; // Array
let persona = { nombre: "Carlos", edad: 30 }; // Objeto
Tipos de datos en JavaScript
JavaScript tiene dos tipos principales de datos:
Primitivos: string , number , boolean , undefined , null , bigint , symbol .
Estructurados: Object , Array , Function .
Operadores en JavaScript
Operadores Aritméticos
+ , - , * , / , % , ++ , --
let suma = 10 + 5; // 15
let residuo = 10 % 3; // 1
let residuoPar = 10 % 2; // 0
Operadores de Comparación
== , === , != , !== , < , > , <= , >=
Semana 3: Introducción a JavaScript y jQuery 3
[Link](5 == "5"); // true (compara solo el valor)
[Link](5 === "5"); // false (compara valor y tipo)
[Link](5 >= 10); // false (compara valor)
Operadores Lógicos
&& (AND), || (OR), ! (NOT)
let esMayor = (edad > 18) && (edad < 65);
Estructuras de Control
1. Condicionales:
let edad = 20;
if (edad >= 18) {
[Link]("Eres mayor de edad");
} else {
[Link]("Eres menor de edad");
}
2. Switch 🚫:
let dia = 3;
switch (dia) {
case 1: [Link]("Lunes"); break;
case 2: [Link]("Martes"); break;
case 3: [Link]("Miércoles"); break;
default: [Link]("Día no válido");
}
Semana 3: Introducción a JavaScript y jQuery 4
Bucles
for
while
do-while
for (let i = 0; i < 5; i++) {
[Link]("Número " + i);
}
foreach
// Ejemplo 1: Recorriendo un array de números
const numeros = [1, 2, 3, 4, 5];
[Link](function(numero) {
[Link](numero * 2); // Imprime el doble de cada número
});
// Ejemplo 2: Recorriendo un array de strings
const frutas = ['manzana', 'banana', 'naranja'];
[Link](function(fruta, indice) {
[Link](`La fruta en el índice ${indice} es: ${fruta}`);
});
Funciones y Eventos en JavaScript
Semana 3: Introducción a JavaScript y jQuery 5
Las funciones son bloques de código reutilizables.
function saludar(nombre) {
return "Hola, " + nombre + "!";
}
[Link](saludar("Yeison"));
Funciones flecha ( arrow-functions )
const sumar = (a, b) => a + b;
[Link](sumar(5, 3)); // 8
Eventos en el DOM
Los eventos permiten la interacción del usuario con la página.
[Link]("btn").addEventListener("click", function() {
alert("¡Hiciste clic en el botón!");
});
Manipulación del DOM
El
DOM (Document Object Model) es una representación estructurada del
documento HTML que permite a JavaScript acceder y manipular los elementos de
la página. A través del DOM podemos modificar contenido, cambiar estilos,
agregar o eliminar elementos, y responder a eventos del usuario.
Técnicamente el DOM es una API Web que permite a los desarrolladores usar la
lógica de programación para realizar cambios en el código
Semana 3: Introducción a JavaScript y jQuery 6
HTML . Es una manera confiable de realizar cambios que convierten los sitios web
estáticos en dinámicos.
Para tener acceso a los elementos de HTML que se quieren manipular, necesitas
hacer que JavaScript sea consciente de la existencia de dichos elementos. A esto
nos referimos generalmente como "selección" de elementos – básicamente es
enlazarlos.
Selección de elementos
let parrafo = [Link]("texto");
let botones = [Link]("button");
let elementosClase = [Link]("miClase");
let query = [Link](".miClase");
Modificar contenido y/o estilos
[Link]("titulo").innerText = "Nuevo título";
[Link]("caja").[Link] = "blue";
Crear y eliminar elementos
let nuevoElemento = [Link]("p");
[Link] = "Este es un párrafo nuevo";
[Link](nuevoElemento);
Agregar y eliminar clases dinámicamente
[Link]("miCaja").[Link]("nuevaClase"); // Agregar cla
[Link]("miCaja").[Link]("nuevaClase"); // Eliminar
[Link]("miCaja").[Link]("resaltado"); // Alternar cla
Semana 3: Introducción a JavaScript y jQuery 7
Eventos en el DOM
Un evento es cualquier interacción del usuario con la página, como hacer clic,
mover el ratón o presionar una tecla.
Agregar eventos con addEventListener
[Link]("miBoton").addEventListener("click", function() {
alert("¡Botón clickeado!");
});
Ejemplo de eventos en formularios
[Link]("miFormulario").addEventListener("submit", function(
[Link](); // Evita que el formulario se envíe
alert("Formulario enviado correctamente");
});
Evento Descripción Ejemplo
Se activa cuando un usuario [Link]("click",
click
hace clic en un elemento. miFuncion);
Se activa cuando el cursor [Link]("mouseover",
mouseover
entra en un elemento. miFuncion);
Se activa cuando el cursor sale [Link]("mouseout",
mouseout
de un elemento. miFuncion);
Se activa cuando una tecla es [Link]("keydown",
keydown
presionada. miFuncion);
Se activa cuando una tecla es [Link]("keyup",
keyup
soltada. miFuncion);
Semana 3: Introducción a JavaScript y jQuery 8
Se activa cuando el valor de [Link]("change",
change
un input cambia. miFuncion);
Se activa cuando un formulario [Link]("submit",
submit
es enviado. miFuncion);
Sesión 6: Introducción a jQuery
JQuery
jQuery es una biblioteca de JavaScript que simplifica la manipulación del DOM,
eventos y AJAX. Su principal ventaja es la facilidad para seleccionar elementos y
aplicarles cambios sin necesidad de código extenso.
Ventajas de jQuery
✅ Sintaxis simple y fácil de aprender.
✅ Reduce la cantidad de código JavaScript necesario.
✅ Compatible con múltiples navegadores.
✅ Facilita la manipulación del DOM y eventos.
✅ Integra efectos y animaciones avanzadas.
Selectores en jQuery:
Los selectores en jQuery se basan en la sintaxis de CSS y se invocan mediante
$() .
$("p") // Selecciona todos los párrafos
$("#id") // Selecciona un elemento por su ID
$(".clase") // Selecciona todos los elementos con una clase específica
$("div p") // Selecciona todos los párrafos dentro de un div
Semana 3: Introducción a JavaScript y jQuery 9
Cómo incluir jQuery en un proyecto
Para usar jQuery, puedes incluirlo mediante un CDN o descargarlo localmente.
La opción recomendada es a través del CDN:
<script src="[Link]
Descarga Local
1. Descarga jQuery desde [Link]
2. Incluye el archivo en tu proyecto: <script src="js/[Link]"></script>
Sintaxis Básica de jQuery
La sintaxis principal de jQuery sigue esta estructura:
$(selector).acción();
$ : Indica que estamos usando jQuery.
selector : Selecciona elementos del DOM (como en CSS).
acción() : Define la acción que queremos realizar.
<p id="miParrafo"></p>
$(document).ready(function(){
$("#miParrafo").text("Nuevo texto con jQuery");
});
Semana 3: Introducción a JavaScript y jQuery 10
1️⃣ Selección de Elementos
Método Descripción Ejemplo
$("#id") Selecciona un elemento por ID $("#titulo")
$(".clase") Selecciona elementos por clase $(".caja")
$(" * ") Selecciona todos los elementos $(" * ")
("[atributo]") Selecciona por atributo ("[type='text']")
$(document).ready(function(){
$("p").css("color", "blue");
});
2️⃣ Modificación del Contenido
Método Descripción Ejemplo
.html() Obtiene o establece contenido HTML $("#miDiv").html("<b>Hola</b>")
.text() Obtiene o cambia solo texto $("#miParrafo").text("Texto nuevo")
.val() Obtiene o cambia el valor de un input $("#nombre").val("Juan")
$("#miInput").val("Nuevo valor");
$("#miInput").val(); // recoge el valor que tiene #input
3️⃣ Manipulación de Atributos
Método Descripción Ejemplo
.attr() Obtiene o establece atributos $("img").attr("src", "[Link]")
.removeAttr() Elimina un atributo $("input").removeAttr("disabled")
$("a").attr("href", "[Link]
Semana 3: Introducción a JavaScript y jQuery 11
4️⃣ Manejo de Eventos
jQuery facilita la gestión de eventos como click , mouseover , keypress , etc.
Evento Descripción Ejemplo de Implementación
Se activa cuando el usuario hace $('#btn').click(function() {
click
clic en un elemento. alert('¡Clicado!'); });
Se activa cuando el usuario pasa el $('#box').hover(function() {
hover mouse sobre un elemento y cuando $(this).css('color', 'red'); }, function() {
lo retira. $(this).css('color', 'black'); });
Se activa cuando el usuario suelta $('#input').keyup(function() {
keyup
una tecla después de presionarla. [Link]($(this).val()); });
Se activa cuando el usuario $('#input').keydown(function() {
keydown
presiona una tecla. [Link]('Tecla presionada'); });
Se activa cuando el valor de un
$('#select').change(function() {
change campo de entrada cambia (por
alert($(this).val()); });
ejemplo, en un <select> o <input> ).
Se activa cuando un elemento
$('#input').focus(function() {
focus obtiene el foco (por ejemplo, al
$(this).css('border', '2px solid blue'); });
hacer clic en un campo de texto).
Se activa cuando un elemento $('#input').blur(function() {
blur
pierde el foco. $(this).css('border', '1px solid black'); });
$('form').submit(function(event) {
Se activa cuando se envía un
submit [Link](); alert('Formulario
formulario. enviado'); });
$('#box').mouseover(function() {
Se activa cuando el puntero del
mouseover $(this).css('background-color', 'yellow');
mouse entra en un elemento. });
$('#box').mouseout(function() {
Se activa cuando el puntero del
mouseout $(this).css('background-color', 'white');
mouse sale de un elemento. });
Se activa cuando el usuario hace $('#btn').dblclick(function() {
dblclick
doble clic en un elemento. alert('¡Doble clic!'); });
Semana 3: Introducción a JavaScript y jQuery 12
$(window).resize(function() {
Se activa cuando se redimensiona
resize [Link]('Ventana redimensionada');
la ventana del navegador. });
Se activa cuando el usuario
$(window).scroll(function() {
scroll desplaza el contenido de un
[Link]('Scroll detectado'); });
elemento.
Efectos y AJAX
1️⃣ Efectos y Animaciones
Método Descripción Ejemplo
.hide() Oculta un elemento $("#caja").hide();
.show() Muestra un elemento $("#caja").show();
Aparece con efecto de
.fadeIn() $("#caja").fadeIn();
desvanecimiento
.fadeOut() Desvanece un elemento $("#caja").fadeOut();
.slideDown() Muestra deslizando hacia abajo $("#caja").slideDown();
.slideUp() Oculta deslizando hacia arriba $("#caja").slideUp();
.toggle() Alterna entre mostrar y ocultar $("#caja").toggle();
1. .hide :
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Hide Example</title>
<script src="[Link]
<style>
#caja {
width: 200px;
height: 100px;
Semana 3: Introducción a JavaScript y jQuery 13
background-color: lightblue;
text-align: center;
line-height: 100px;
}
</style>
</head>
<body>
<div id="caja">Caja Visible</div>
<button id="btnHide">Ocultar</button>
<script>
$(document).ready(function() {
$('#btnHide').click(function() {
$('#caja').hide(); // Oculta la caja
});
});
</script>
</body>
</html>
2. .show()
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Show Example</title>
<script src="[Link]
<style>
#caja {
width: 200px;
height: 100px;
background-color: lightgreen;
text-align: center;
Semana 3: Introducción a JavaScript y jQuery 14
line-height: 100px;
display: none; /* Inicialmente oculto */
}
</style>
</head>
<body>
<div id="caja">Caja Oculta</div>
<button id="btnShow">Mostrar</button>
<script>
$(document).ready(function() {
$('#btnShow').click(function() {
$('#caja').show(); // Muestra la caja
});
});
</script>
</body>
</html>
3. .fadeIn() : Aparece un elemento con un efecto de desvanecimiento.
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>FadeIn Example</title>
<script src="[Link]
<style>
#caja {
width: 200px;
height: 100px;
background-color: lightcoral;
text-align: center;
line-height: 100px;
Semana 3: Introducción a JavaScript y jQuery 15
display: none; /* Inicialmente oculto */
}
</style>
</head>
<body>
<div id="caja">Caja Desvanecida</div>
<button id="btnFadeIn">Aparecer</button>
<script>
$(document).ready(function() {
$('#btnFadeIn').click(function() {
$('#caja').fadeIn(1000); // Aparece con un efecto de desvanecimien
});
});
</script>
</body>
</html>
4. .fadeOut() : Desvanece un elemento hasta que desaparece.
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>FadeOut Example</title>
<script src="[Link]
<style>
#caja {
width: 200px;
height: 100px;
background-color: lightseagreen;
text-align: center;
line-height: 100px;
}
Semana 3: Introducción a JavaScript y jQuery 16
</style>
</head>
<body>
<div id="caja">Caja Visible</div>
<button id="btnFadeOut">Desvanecer</button>
<script>
$(document).ready(function() {
$('#btnFadeOut').click(function() {
$('#caja').fadeOut(1000); // Desvanece la caja en 1 segundo
});
});
</script>
</body>
</html>
5. .slideDown() :Muestra un elemento deslizándolo hacia abajo.
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SlideDown Example</title>
<script src="[Link]
<style>
#caja {
width: 200px;
height: 100px;
background-color: lightgoldenrodyellow;
text-align: center;
line-height: 100px;
display: none; /* Inicialmente oculto */
}
</style>
Semana 3: Introducción a JavaScript y jQuery 17
</head>
<body>
<div id="caja">Caja Oculta</div>
<button id="btnSlideDown">Mostrar</button>
<script>
$(document).ready(function() {
$('#btnSlideDown').click(function() {
$('#caja').slideDown(1000); // Muestra la caja con un efecto de des
});
});
</script>
</body>
</html>
6. .slideUp() : Oculta un elemento deslizándolo hacia arriba.
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SlideUp Example</title>
<script src="[Link]
<style>
#caja {
width: 200px;
height: 100px;
background-color: lightpink;
text-align: center;
line-height: 100px;
}
</style>
</head>
<body>
Semana 3: Introducción a JavaScript y jQuery 18
<div id="caja">Caja Visible</div>
<button id="btnSlideUp">Ocultar</button>
<script>
$(document).ready(function() {
$('#btnSlideUp').click(function() {
$('#caja').slideUp(1000); // Oculta la caja con un efecto de deslizam
});
});
</script>
</body>
</html>
7. .toggle() : Alterna entre mostrar y ocultar un elemento.
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Toggle Example</title>
<script src="[Link]
<style>
#caja {
width: 200px;
height: 100px;
background-color: lightskyblue;
text-align: center;
line-height: 100px;
}
</style>
</head>
<body>
<div id="caja">Caja Visible</div>
<button id="btnToggle">Alternar</button>
Semana 3: Introducción a JavaScript y jQuery 19
<script>
$(document).ready(function() {
$('#btnToggle').click(function() {
$('#caja').toggle(1000); // Alterna entre mostrar y ocultar con una a
});
});
</script>
</body>
</html>
Ajax
AJAX permite cargar contenido sin recargar la página.
AJAX (Asincrónico JavaScript y XML) es una técnica de desarrollo web que
permite a las aplicaciones web enviar y recibir datos del servidor sin necesidad de
recargar la página completa. Esto mejora significativamente la experiencia del
usuario, ya que se pueden actualizar partes específicas de una página
dinámicamente.
Aunque el nombre incluye "XML", en la práctica, AJAX puede trabajar con varios
formatos de datos, como JSON , HTML , o incluso texto plano. Hoy en día, JSON
es el formato más común debido a su simplicidad y compatibilidad con
JavaScript.
¿Cómo funciona AJAX?
1. Solicitud al servidor : El navegador envía una solicitud HTTP asincrónica al
servidor usando JavaScript.
Semana 3: Introducción a JavaScript y jQuery 20
2. Procesamiento en el servidor : El servidor procesa la solicitud y devuelve los
datos solicitados (generalmente en formato JSON).
3. Actualización del DOM : El navegador recibe los datos y actualiza solo la
parte relevante de la página sin recargarla completamente.
Ventajas de AJAX
1. Mejora la experiencia del usuario : Las páginas no necesitan recargarse
completamente, lo que hace que la interacción sea más rápida y fluida.
2. Reducción del tráfico de red : Solo se transfieren los datos necesarios, en
lugar de toda la página.
3. Interactividad : Permite crear aplicaciones web dinámicas y modernas.
Desventajas de AJAX
1. SEO limitado : Los motores de búsqueda pueden tener dificultades para
indexar contenido cargado dinámicamente.
2. Dependencia de JavaScript : Si el usuario tiene deshabilitado JavaScript, las
funcionalidades basadas en AJAX no funcionarán.
3. Complejidad adicional : Requiere un manejo cuidadoso de errores y estados
para garantizar una buena experiencia del usuario.
Método Descripción Ejemplo
Cargar
.load() contenido $("#div").load("[Link]")
AJAX
Obtener datos
$.get() $.get("[Link]", function(d){ [Link](d); });
AJAX
Ejemplo:
Semana 3: Introducción a JavaScript y jQuery 21
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ejemplo AJAX con API</title>
<script src="[Link]
</head>
<body>
<h1>Lista de Usuarios</h1>
<ul id="listaUsuarios"></ul>
<button id="btnCargarUsuarios">Cargar Usuarios</button>
<script>
$(document).ready(function() {
$('#btnCargarUsuarios').click(function() {
$.ajax({
url: '[Link] // URL de la API
method: 'GET',
dataType: 'json',
success: function(data) {
let lista = '';
[Link](usuario => {
lista += `<li>${[Link]} (${[Link]})</li>`;
});
$('#listaUsuarios').html(lista); // Mostrar la lista en el DOM
},
error: function() {
alert('Error al cargar los usuarios.');
}
});
});
});
</script>
Semana 3: Introducción a JavaScript y jQuery 22
</body>
</html>
Proyecto JQUERY
Ejercicios Integradores (HTML, CSS y JavaScript)
Ejercicio 1: Formulario Validado con jQuery
Crea un formulario de contacto con validación en tiempo real. Debe verificar que
los campos no estén vacíos y que el correo tenga un formato válido.
<!DOCTYPE html>
<html>
<head>
<title>Formulario Validado</title>
<style>
.error {
color: red;
}
</style>
</head>
<body>
<form id="formulario">
<label for="email">Correo Electrónico:</label>
<input type="email" id="email" name="email">
<button type="submit">Enviar</button>
</form>
<script src="[Link]
<script>
$(document).ready(function() {
$("#formulario").submit(function(event) {
let email = $("#email").val();
Semana 3: Introducción a JavaScript y jQuery 23
let regex = /^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/;
if(email === "" || ) {
alert("Por favor, introduce un correo válido.");
[Link]();
}
});
});
</script>
</body>
</html>
$(document).ready(function() {
$("#formulario").submit(function(event) {
let email = $("#email").val();
let regex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
if(email === "" || ) {
alert("Por favor, introduce un correo válido.");
[Link]();
}
});
});
Ejercicio 2: Menú Desplegable con jQuery
Implementa un menú de navegación que muestre y oculte sus opciones al hacer
clic en un botón.
<!DOCTYPE html>
<html>
<head>
<title>Menú Desplegable</title>
<style>
#menu {
Semana 3: Introducción a JavaScript y jQuery 24
display: none;
}
</style>
</head>
<body>
<button id="boton-menu">Mostrar Menú</button>
<ul id="menu">
<li>Opción 1</li>
<li>Opción 2</li>
<li>Opción 3</li>
</ul>
<script src="[Link]
<script>
$(document).ready(function() {
$("#boton-menu").click(function() {
$("#menu").slideToggle();
});
});
</script>
</body>
</html>
$(document).ready(function() {
$("#boton-menu").click(function() {
$("#menu").slideToggle();
});
});
Ejercicio 3: Carrusel de Imágenes con jQuery
Desarrolla un carrusel de imágenes donde los usuarios puedan navegar entre
ellas usando botones de siguiente y anterior.
$(document).ready(function() {
let actual = 0;
Semana 3: Introducción a JavaScript y jQuery 25
let imagenes = $(".imagen");
$("#siguiente").click(function() {
$(imagenes[actual]).hide();
actual = (actual + 1) % [Link];
$(imagenes[actual]).show();
});
$("#anterior").click(function() {
$(imagenes[actual]).hide();
actual = (actual - 1 + [Link]) % [Link];
$(imagenes[actual]).show();
});
});
Ejercicio 4: Lista Dinámica de Tareas
Crea una aplicación de lista de tareas donde los usuarios puedan agregar y
eliminar elementos dinámicamente.
<!DOCTYPE html>
<html>
<head>
<title>Lista de Tareas</title>
</head>
<body>
<input type="text" id="tarea">
<button id="agregar">Agregar</button>
<ul id="lista"></ul>
<script src="[Link]
<script>
$(document).ready(function() {
$("#agregar").click(function() {
let tarea = $("#tarea").val();
if(tarea) {
$("#lista").append("<li>" + tarea + " <button class='eliminar'>X</but
Semana 3: Introducción a JavaScript y jQuery 26
$("#tarea").val("");
}
});
$("#lista").on("click", ".eliminar", function() {
$(this).parent().remove();
});
});
</script>
</body>
</html>
$(document).ready(function() {
$("#agregar").click(function() {
let tarea = $("#tarea").val();
if(tarea) {
$("#lista").append("<li>" + tarea + " <button class='eliminar'>X</button>
$("#tarea").val("");
}
});
$("#lista").on("click", ".eliminar", function() {
$(this).parent().remove();
});
});
Ejercicio 5: Consumo de API y Renderizado de Datos
Utiliza jQuery para hacer una solicitud AJAX a una API pública y mostrar la
información en la interfaz.
Semana 3: Introducción a JavaScript y jQuery 27
$(document).ready(function() {
$("#cargar").click(function() {
$.get("[Link] function(data) {
let lista = "";
[Link](usuario => {
lista += "<li>" + [Link] + " - " + [Link] + "</li>";
});
$("#usuarios").html(lista);
});
});
});
Proyecto Semana 3:
Interfaz Dinámica con jQuery:
Agregar al ejercicio del portafolio dinamismo, como un formulario de contacto,
entre otras.
Semana 3: Introducción a JavaScript y jQuery 28
