javascript - Cambiando el color del botón programáticamente
button label (7)
¿Hay alguna manera de cambiar el color de un botón, o al menos el color de la etiqueta del botón mediante programación? Puedo cambiar la etiqueta con
document.getElementById("button").object.textElement.innerText = "newlabel";
¿Pero cómo cambiar el color?
Aquí hay un ejemplo usando HTML:
<input type="button" value="click me" onclick="this.style.color=''#000000'';
this.style.backgroundColor = ''#ffffff''" />
Y aquí hay un ejemplo usando JavaScript:
document.getElementById("button").bgcolor="#Insert Color Here";
Creo que quieres bgcolor. Algo como esto:
document.getElementById("button").bgcolor="#ffffff";
Aquí hay un par de demostraciones que pueden ayudar:
Finalmente encontré un código de trabajo, prueba esto:
document.getElementById("button").style.background=''#000000'';
Probablemente sea mejor cambiar el nombre de clase:
document.getElementById("button").className = ''button_color'';
Luego agrega un estilo buton al CSS donde puede establecer el color de fondo y cualquier otra cosa.
Si lo asignas a una clase debería funcionar:
<script>
function changeClass(){
document.getElementById(''myButton'').className = ''formatForButton'';
}
</script>
<style>
.formatForButton {
background-color:pink;
}
</style>
<body>
<input id=''myButton'' type=button class=none value=''Change Color to pink'' onclick=''changeClass()''>
</body>
Prueba este código . Quizás quieras algo como esto.
<button class="normal" id="myButton"
value="Hover" onmouseover="mouseOver()"
onmouseout="mouseOut()">Some text</button>
Luego, en su archivo .js, ingrese esto. Asegúrese de que su html esté conectado a su .js
var tag=document.getElementById("myButton");
function mouseOver() {
tag.style.background="yellow";
};
function mouseOut() {
tag.style.background="white";
};
use jquery : $("#id").css("background","red");