Contador de Palabras en JavaScript

Contador de Palabras en JavaScript

Sexto proyecto de la guia 50 Proyectos de Programacion para Practicar y Aprender. Proyectos para Principiantes

Enlace Patrocinado

Respondent.io

Respondent.io es una plataforma en línea que conecta investigadores y empresas con participantes para estudios de mercado y encuestas remuneradas. Su objetivo es facilitar la recopilación de datos cualitativos y cuantitativos mediante entrevistas, encuestas y pruebas de usuario

Enunciado del proyecto

Esta herramienta permite al usuario ingresar un texto y obtener automáticamente la cantidad de palabras que contiene.

Código HTML, CSS y JavaScript

<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="UTF-8">
  <title>Contador de Palabras</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      padding: 20px;
      background-color: #f9f9f9;
    }
    textarea {
      width: 100%;
      height: 120px;
      padding: 10px;
      margin-bottom: 10px;
    }
    button {
      padding: 10px 20px;
      margin-bottom: 10px;
    }
    #resultado {
      font-weight: bold;
      font-size: 18px;
    }
  </style>
</head>
<body>

  <h2>Contador de Palabras</h2>

  <textarea id="texto" placeholder="Escribe tu texto aquí..."></textarea>
  <br/>
  <button onclick="contarPalabras()">Contar Palabras
</button>
  <p id="resultado"></p>

  <script>
    function contarPalabras() {
      const texto = document.getElementById("texto")
.value.trim();
      if (texto === "") {
        document.getElementById("resultado").innerText = 
"No hay palabras.";
        return;
      }

      const palabras = texto.split(/\s+/);
      document.getElementById("resultado").innerText = 
"Número de palabras: " + palabras.length;
    }
  </script>

</body>
</html>

Contador de Palabras en JavaScript. Explicación del Código

  • HTML: Contiene un textarea para que el usuario escriba el texto, un botón y un párrafo para mostrar el resultado.
  • CSS: Estilos simples para mejorar la presentación visual.
  • JavaScript: La función contarPalabras() toma el texto, lo separa por espacios usando split(/\s+/) y cuenta cuántos elementos tiene el arreglo.

Indice de la guia de proyectos

50 Proyectos de Programacion

PCComponentes Black Friday hasta 60% de descuento #colaboracion #publicidad.

Proyecto anterior

Lista de Tareas (To-Do List) en JavaScript

Groupon NOVIEMBRE DEALS Groupon llega con los mejores planes y descuentos para disfrutar al máximo la temporada. 🍂 🎟️ Actividades locales al mejor precio 💆 Bienestar, belleza y relax con descuentazos 🍽️ Restaurantes y experiencias únicas 🛍️ Ofertas exclusivas para ahorrar más 👉#colaboracion #publicidad.