Ejercicios JavaScript

Saludo personalizado

let nombre = prompt("¿Cómo te llamás?");
alert("¡Hola " + nombre + "!");

Tabla de multiplicar

let numero = Number(prompt("Ingresá un número:"));
for (let i = 1; i <= 10; i++) {
  alert(numero + " x " + i + " = " + (numero * i));
}

Validación de contraseña

let pass = prompt("Ingresá una contraseña:");
if (pass.length >= 8) {
  alert("Contraseña segura.");
} else {
  alert("Demasiado corta.");
}

Detector de vocales

let texto = prompt("Ingresá una palabra:");
for (let letra of texto) {
  if ("aeiou".includes(letra.toLowerCase())) {
    console.log("Vocal: " + letra);
  }
}
alert("Revisá la consola para ver las vocales.");

Calculadora de edad

let año = prompt("¿En qué año naciste?");
let edad = 2025 - parseInt(año);
alert("Tenés aproximadamente " + edad + " años.");

Cuenta regresiva

for (var i = 5; i >= 1; i--) {
  console.log(i);
}
alert("¡Despegue!");

Validación de número

var numero;
do {
  numero = parseFloat(prompt("Ingresá un número mayor a 100:"));
} while (numero <= 100);
alert("¡Gracias! Ingresaste un número válido: " + numero);

Tabla de multiplicar mejorada

var numero = prompt("Ingresa un número");
numero = parseFloat(numero);
if (isNaN(numero)) {
  alert("ERROR: Tienes que ingresar un número");
} else {
  var mensaje = "Tabla del " + numero + "\n"; 
  for (var i = 1; i <= 10; i++) {
    mensaje += numero + " x " + i + " = " + (numero * i) + "\n";
  }
  alert(mensaje);
}

Día de la semana

var fechaTexto = prompt("Ingresá una fecha (mm/dd/yyyy):");
var fecha = new Date(fechaTexto);
var dias = ["Domingo","Lunes","Martes","Miércoles","Jueves","Viernes","Sábado"];
var dia = dias[fecha.getDay()];
alert("La fecha ingresada corresponde a un " + dia);

Ejercicio DOM

 function cambiarTitulo() {
    var titulo = document.getElementById("titulo-dinamico");
    titulo.textContent = "🎉 ¡Título Cambiado!";
}

function cambiarParrafo() {
    var parrafo = document.getElementById("parrafo-dinamico");
    parrafo.textContent = "El DOM ha sido manipulado exitosamente! 🎯";
}

function cambiarColores() {
    var titulo = document.getElementById("titulo-dinamico");
    var parrafo = document.getElementById("parrafo-dinamico");

    titulo.style.color = "#e74c3c";   
    parrafo.style.color = "#27ae60"; 
}

function resetearEjercicio1() {
    var titulo = document.getElementById("titulo-dinamico");
    var parrafo = document.getElementById("parrafo-dinamico");

    titulo.textContent = "🌟 Título Original";
    parrafo.textContent = "Este es el párrafo original que cambiará.";

    titulo.style.color = ""; 
    parrafo.style.color = ""; 
}

Ejercicio DOM

var input = document.getElementById("nuevo-item");
    var texto = input.value.trim();

    if (texto !== "") {
        var nuevoElemento = document.createElement("li");
        nuevoElemento.textContent = "✅ " + texto;
        nuevoElemento.setAttribute("onclick", "eliminarEste(this)");

        var lista = document.getElementById("lista-dinamica");
        lista.appendChild(nuevoElemento);

        input.value = "";
    } else {
        alert("Escribe algo antes de agregar.");
    }
}


function eliminarEste(elemento) {
    elemento.remove();
}

function eliminarUltimo() {
    var lista = document.getElementById("lista-dinamica");

    if (lista.lastChild) {
        lista.removeChild(lista.lastChild);
    }
}

function limpiarLista() {
    var lista = document.getElementById("lista-dinamica");
    lista.innerHTML = "";
}

Ejercicio DOM

function agregarElemento() {
    var input = document.getElementById("nuevo-item");
    var texto = input.value.trim();

    if (texto !== "") {
        var nuevoElemento = document.createElement("li");
        nuevoElemento.textContent = "✅ " + texto;
        nuevoElemento.setAttribute("onclick", "eliminarEste(this)");

        var lista = document.getElementById("lista-dinamica");
        lista.appendChild(nuevoElemento);

        input.value = "";
    } else {
        alert("Escribe algo antes de agregar.");
    }
}


function eliminarEste(elemento) {
    elemento.remove();
}

function eliminarUltimo() {
    var lista = document.getElementById("lista-dinamica");

    if (lista.lastChild) {
        lista.removeChild(lista.lastChild);
    }
}

function limpiarLista() {
    var lista = document.getElementById("lista-dinamica");
    lista.innerHTML = "";
}

Ejercicio DOM

function actualizarContador() {

    let contador = document.getElementById("contador");
    let info = document.getElementById("info-contador");
    contador.textContent = contadorValor;

    if (contadorValor > 0) {
        contador.style.color = "#27ae60"; 
        info.textContent = "Valor actual: " + contadorValor + " | Estado: Positivo";
    } else if (contadorValor < 0) {
        contador.style.color = "#e74c3c"; 
        info.textContent = "Valor actual: " + contadorValor + " | Estado: Negativo";
    } else {
        contador.style.color = "#2c3e50"; 
        info.textContent = "Valor actual: " + contadorValor + " | Estado: Cero";
    }
}

function incrementar() {
    contadorValor++;
    actualizarContador();
}

function decrementar() {
    contadorValor--;
    actualizarContador();
}

function multiplicar() {
    contadorValor *= 2;
    actualizarContador();
}

function resetearContador() {
    contadorValor = 0;
    actualizarContador();
}

function numeroRandom() {
    contadorValor = Math.floor(Math.random() * 201) - 100; 
    actualizarContador();
}

Ejercicio DOM

function generarGaleria() {
    const categoria = document.getElementById("categoria-emoji").value;
    const contenedor = document.getElementById("galeria-emojis");

    contenedor.innerHTML = "";

    emojis[categoria].forEach(emoji => {
        const div = document.createElement("div");
        div.classList.add("imagen-item");
        div.textContent = emoji;


        div.onclick = () => seleccionarEmoji(emoji);

        contenedor.appendChild(div);
    });
}

function seleccionarEmoji(emoji) {
    const seleccionada = document.getElementById("emoji-seleccionado");
    seleccionada.textContent = "Has sellecionado" + emoji;
}

function limpiarGaleria() {


    const contenedor = document.getElementById("galeria");
    contenedor.innerHTML = "";

    const seleccionado = document.getElementById("emoji-seleccionado");
    seleccionado.textContent = "Ningun emoji seleccionado";
}

Ejercicio DOM

function crearTarjeta() {
    const titulo = document.getElementById('titulo-tarjeta').value.trim();
    const contenido = document.getElementById('contenido-tarjeta').value.trim();
    const color = document.getElementById('color-tarjeta').value;


    if (titulo === '' || contenido === '') {
        alert('Por favor, completa el título y el contenido.');
        return;
    }

    const tarjeta = document.createElement('div');
    tarjeta.classList.add('tarjeta');
    `;
    const contenedor = document.getElementById('contenedor-tarjetas');
    contenedor.appendChild(tarjeta);

    document.getElementById('titulo').value = '';
    document.getElementById('contenido').value = '';
    document.getElementById('color').value = '#000000';

    actualizarInfoTarjetas();
}

function eliminarTarjeta(boton) {
    boton.parentElement.remove();

    actualizarInfoTarjetas();
}

function eliminarTodas() {

    const contenedor = document.getElementById("contenedor-tarjetas");
    contenedor.innerHTML = ''; 
    actualizarInfoTarjetas();  
}

function actualizarInfoTarjetas() 
    
    const contenedor = document.getElementById('contenedor-tarjetas');
    const total = contenedor.children.length;

    const info = document.getElementById('info-tarjetas');
    info.textContent = `Total de tarjetas: ${total}`;
}