1

Aqui esta mi codigo, es javascript, ignoren los anteriores ejercicios dentro de mi codigo. El punto d que se explica en el titulo de la pregunta es el problema. Agradeceria bastante la ayuda en este ejercicio y sinceramente no se que mas escribir porque no me deja publicar mi problema la pagina.

<script type="text/javascript">
    
        function procesarFuncion() {
        // a) Mensaje de error
        var campos = [
                    document.getElementById("campo1").value.trim() ,
                    document.getElementById("campo2").value.trim(),
                    document.getElementById("campo3").value.trim(),
                    document.getElementById("campo4").value.trim(),
                    document.getElementById("campo5").value.trim(),
                    document.getElementById("campo6").value.trim(),
                    document.getElementById("campo7").value.trim(),
                    document.getElementById("campo8").value.trim(),
                    document.getElementById("campo9").value.trim(),
                    document.getElementById("campo10").value.trim()
                    ];
    
                var parrafo = document.getElementById('mensaje')
    
                for ( var i = 0; i < campos.length ; i++ ) {
                if (campos[i] === "") {
                    parrafo.style.color='red'
                    parrafo.innerHTML = 'Complete todos los campos'
                } else {
                    console.log('Campos completados')
                }
            }
    
            // b) Campo con mayor y menor longitud
    
            var palabras2 = campos[0]
            var indicePalabras2 = 0
    
            for (var i = 1; i < campos.length; i++) {
                if (campos[i].length > palabras2.length) {
                    palabras2 = campos[i]
                    indicePalabras2 = i
                }
            }
    
            console.log('El campo con mayor longitud es: Texto ' + (indicePalabras2 + 1))
    
            var campoMenor = campos[0]
            var indiceCampo2 = 0
    
            for (var i = 1; i < campos.length; i++) {
                if (campos[i].length < campoMenor.length) {
                    campoMenor = campos[i]
                    indiceCampo2 = i
                }
            }
    
            console.log('El campo con menor longitud es: Texto ' + (indiceCampo2 + 1))
    
    
            //c) mayor y menor cantidad de palabras
    
            var mayorCant = campos[0]
            var menorCant = campos[0]
            var indiceMayorCant = 0
            var indiceMenorCant = 0
    
            for(i = 1; i < campos.length; i++) {
                var palabras = campos[i].split(' ')
             if (palabras.length > mayorCant.split(' ').length) {
                mayorCant = campos[i]
                indiceMayorCant = i
            } if (palabras.length < menorCant.split(' ').length) {
                menorCant = campos[i]
                indiceMenorCant = i
            }
        }
    
            console.log('El campo con mayor cantidad de palabras es Texto ' + (indiceMayorCant + 1) + ' con ' + mayorCant.split(' ').length + ' palabras.')
            console.log('El campo con menor cantidad de palabras es Texto ' + (indiceMenorCant + 1) + ' con ' + menorCant.split(' ').length + ' palabras.')
    
        // d) Debe escribir mas de una palabra
    
    
        for (i = 0; i < campos.length; i++) {
            var palabras = campos[i].split(" ");
                if (palabras.length === 1) {
                document.getElementById("mensaje2").style.color = "red";
                document.getElementById("campo" + (i + 1)).value = "DEBE ESCRIBIR MAS DE UNA PALABRA";
                document.getElementById("mensaje2").innerHTML = "Debe escribir mas de una palabra en el campo " + (i + 1);
                return;
            }
    }
    
    
    // Si alguno de los campos tiene la palabra examen dentro del texto ingresado el programa deberia cambiar el color del texto a verde
        
    
    
    
    
    
    
    }
    
        </script>
        </head>
    
    <body>
        <h1 align="center" style="font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; font-size: 40px;">Ejercicio 1</h1>
        <div>Texto 1 <input type="text" id="campo1"></div>
        <div>Texto 2 <input type="text" id="campo2"></div>
        <div>Texto 3 <input type="text" id="campo3"></div>
        <div>Texto 4 <input type="text" id="campo4"></div>
        <div>Texto 5 <input type="text" id="campo5"></div>
        <div>Texto 6 <input type="text" id="campo6"></div>
        <div>Texto 7 <input type="text" id="campo7"></div>
        <div>Texto 8 <input type="text" id="campo8"></div>
        <div>Texto 9 <input type="text" id="campo9"></div>
        <div>Texto 10 <input type="text"id="campo10"></div>
        <br>
        <br>
        <h2 align="center"><input type="button" value="Procesar" onclick="procesarFuncion()"</h2>
    <br><br>
            <p id="mensaje"></p>
            <p id="mensaje2"></p>
    </body>
    </html>

El ejercicio d es el estoy teniendo problemas, deberia pintar el texto en verde si el for encuentra la palabra 'examen'. Agradeceria bastante la ayuda. Ahora el ejercicio no esta claro pero deberia cambiar el texto a color verde dentro del input text si es que encuentra la palabra 'examen'

1 respuesta 1

0

Dentro del for, podrías hacer una pequeña validación, que consiste en validar si en la variable palabras existe o incluye la palabra examen. Si cumple el if, se pinta de color verde el input correspondiente y al mensaje:

if (palabras.includes("examen")) {
  document.getElementById("campo" + (i + 1)).style.color = "green";
  document.getElementById("mensaje2").style.color = "green";
}

Demo:

function procesarFuncion() {
  // a) Mensaje de error
  var campos = [
    document.getElementById("campo1").value.trim(),
    document.getElementById("campo2").value.trim(),
    document.getElementById("campo3").value.trim(),
    document.getElementById("campo4").value.trim(),
    document.getElementById("campo5").value.trim(),
    document.getElementById("campo6").value.trim(),
    document.getElementById("campo7").value.trim(),
    document.getElementById("campo8").value.trim(),
    document.getElementById("campo9").value.trim(),
    document.getElementById("campo10").value.trim()
  ];

  var parrafo = document.getElementById('mensaje')

  for (var i = 0; i < campos.length; i++) {
    if (campos[i] === "") {
      parrafo.style.color = 'red'
      parrafo.innerHTML = 'Complete todos los campos'
    } else {
      // console.log('Campos completados')
    }
  }

  // b) Campo con mayor y menor longitud
  var palabras2 = campos[0]
  var indicePalabras2 = 0

  for (var i = 1; i < campos.length; i++) {
    if (campos[i].length > palabras2.length) {
      palabras2 = campos[i]
      indicePalabras2 = i
    }
  }
  // console.log('El campo con mayor longitud es: Texto ' + (indicePalabras2 + 1))

  var campoMenor = campos[0]
  var indiceCampo2 = 0

  for (var i = 1; i < campos.length; i++) {
    if (campos[i].length < campoMenor.length) {
      campoMenor = campos[i]
      indiceCampo2 = i
    }
  }
  // console.log('El campo con menor longitud es: Texto ' + (indiceCampo2 + 1))

  // c) mayor y menor cantidad de palabras
  var mayorCant = campos[0]
  var menorCant = campos[0]
  var indiceMayorCant = 0
  var indiceMenorCant = 0

  for (i = 1; i < campos.length; i++) {
    var palabras = campos[i].split(' ')
    if (palabras.length > mayorCant.split(' ').length) {
      mayorCant = campos[i]
      indiceMayorCant = i
    } if (palabras.length < menorCant.split(' ').length) {
      menorCant = campos[i]
      indiceMenorCant = i
    }
  }
  // console.log('El campo con mayor cantidad de palabras es Texto ' + (indiceMayorCant + 1) + ' con ' + mayorCant.split(' ').length + ' palabras.')
  // console.log('El campo con menor cantidad de palabras es Texto ' + (indiceMenorCant + 1) + ' con ' + menorCant.split(' ').length + ' palabras.')

  // d) Debe escribir mas de una palabra
  for (i = 0; i < campos.length; i++) {
    var palabras = campos[i].split(" ");

    if (palabras.includes("examen")) {
      document.getElementById("campo" + (i + 1)).style.color = "green";
      document.getElementById("mensaje2").style.color = "green";
    }

    if (palabras.length === 1) {
      document.getElementById("mensaje2").style.color = "red";
      document.getElementById("campo" + (i + 1)).value = "DEBE ESCRIBIR MAS DE UNA PALABRA";
      document.getElementById("mensaje2").innerHTML = "Debe escribir mas de una palabra en el campo " + (i + 1);
      return;
    } else {
      // lo ideal sería remover el mensaje una vez los inputs estén llenos con más de una palabra.
      document.getElementById("mensaje2").innerHTML = "";
    }
  }
  // Si alguno de los campos tiene la palabra examen dentro del texto ingresado el programa deberia cambiar el color del texto a verde
}
<body>
  <h1 align="center" style="font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; font-size: 40px;">Ejercicio 1</h1>
  <div>Texto 1 <input type="text" id="campo1"></div>
  <div>Texto 2 <input type="text" id="campo2"></div>
  <div>Texto 3 <input type="text" id="campo3"></div>
  <div>Texto 4 <input type="text" id="campo4"></div>
  <div>Texto 5 <input type="text" id="campo5"></div>
  <div>Texto 6 <input type="text" id="campo6"></div>
  <div>Texto 7 <input type="text" id="campo7"></div>
  <div>Texto 8 <input type="text" id="campo8"></div>
  <div>Texto 9 <input type="text" id="campo9"></div>
  <div>Texto 10 <input type="text"id="campo10"></div>
  <br>
  <br>
  <h2 align="center"><input type="button" value="Procesar" onclick="procesarFuncion()"></h2>
  <br>
  <br>
  <p id="mensaje"></p>
  <p id="mensaje2"></p>
</body>

1
  • 1
    muchas gracias cris!
    – user333623
    Commented el 9 jul. 2023 a las 6:51

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.