Establezca el color de una variable de tipo string en JavaScript (element.value) cuando aparece en HTML fuera de un formulario.
Este es un ejemplo simple para ayudar con un proyecto más grande –
Resultado deseado: cuando escribas un nombre en el cuadro del formulario, aparecerá una oración con el nombre incluido. Sin embargo, solo el nombre debe tener el color rojo y solo en el resultado (no debería estar en rojo cuando aparezca en el cuadro del formulario).
Recibo un error cuando incluyo “nameHere.style.color” en este código:
JS:
function getResponse(){
var nameHere = document.getElementById("name").value;
nameHere.style.color = "red";
var resultValue = "Hola, mi nombre es " + nameHere + ", encantado de conocerte.";
document.getElementById("result").innerHTML = resultValue;
}
HTML:
<div class="formclass">
<label for="name">Ingrese el nombre aquí</label>
<input id="name" onchange="getResponse()">
</div>
<div id="result"></div>
¿Existe alguna forma real de hacer lo que estoy intentando hacer dentro de JavaScript?
Edit: para enfatizar, realmente quiero cambiar el color de la variable que toma el valor del elemento, no solo el elemento. Y quiero que aparezca en el resultado con el color. No puedo encontrar nada que me permita hacer esto correctamente.
davy.ai
Desafortunadamente, no puedes cambiar el color únicamente de la variable que contiene el valor del elemento. En lugar de eso, debes crear un nuevo elemento HTML, establecer su innerHTML como el resultado que incluye el nombre con un elemento span alrededor, y luego estilizar únicamente ese elemento span con el color deseado. Aquí tienes un ejemplo de cómo hacerlo:
JS:
CSS:
HTML:
En este ejemplo, hemos agregado un elemento span alrededor del nombre en la cadena resultValue, y le hemos dado una clase llamada “red”. Luego, hemos definido un estilo CSS para que cualquier elemento con esa clase tenga el color rojo. Por último, hemos actualizado la función getResponse para establecer el innerHTML del elemento result como la cadena resultValue con el elemento span alrededor del nombre.