Skip to main content
Improved Formatting
Origen Enlace
rnrneverdies
  • 16.8k
  • 4
  • 53
  • 81
function textoEstado() {
  var checkbox=checkbox = document.getElementById("estadoServicio");

  var parrafo=parrafo = document.createElement("p");
  var tdCheckbox=tdCheckbox = document.getElementById("tdCheckbox");
  var activo=activo = document.createTextNode("Activo");
  var inactivo=inactivo = document.createTextNode("Inactivo");

  if (checkbox.checked) {
    
    tdCheckbox.appendChild(parrafo).style.color=color = 'green';
    parrafo.appendChild(activo);    
}
else
  } else {

    tdCheckbox.appendChild(parrafo).style.color=color = 'red';
    parrafo.appendChild(inactivo);
  }
}
//TODO removeChild activo inactivo
function textoEstado() {
  var checkbox=checkbox = document.getElementById("estadoServicio");

  var parrafo=parrafo = document.createElement("p");
  var parrafo1=parrafo1 = document.createElement("p");
  var tdCheckbox=tdCheckbox = document.getElementById("tdCheckbox");
  var activo=activo = document.createTextNode("Activo");
  var inactivo=inactivo = document.createTextNode("Inactivo");

  if (checkbox.checked) {
    
    tdCheckbox.appendChild(parrafo).style.color=color = 'green';
    parrafo.appendChild(activo);    
}
else
  } else {
    parrafo.removeChild(parrafo.childNodes[0]);
    tdCheckbox.appendChild(parrafo1).style.color=color = 'red';
    parrafo1.appendChild(inactivo);
  }
}

}

//TODO removeChild activo inactivo
function textoEstado() {
  var checkbox=checkbox = document.getElementById("estadoServicio");

  var parrafo=parrafo = document.createElement("p");
  var tdCheckbox=tdCheckbox = document.getElementById("tdCheckbox");
  var activo=activo = document.createTextNode("Activo");
  var inactivo=inactivo = document.createTextNode("Inactivo");

  if (checkbox.checked) {
    
    tdCheckbox.appendChild(parrafo).style.color=color = 'green';
    parrafo.appendChild(activo);    
}
else
  } else {
    parrafo.removeChild(parrafo.childNodes[0]);
    tdCheckbox.appendChild(parrafo).style.color=color = 'red';
    parrafo.appendChild(inactivo);
   }
}
function textoEstado(){
var checkbox= document.getElementById("estadoServicio");

var parrafo= document.createElement("p");
var tdCheckbox= document.getElementById("tdCheckbox");
var activo= document.createTextNode("Activo");
var inactivo= document.createTextNode("Inactivo");

if(checkbox.checked){
    
    tdCheckbox.appendChild(parrafo).style.color= 'green';
    parrafo.appendChild(activo);    
}
else
    {

    tdCheckbox.appendChild(parrafo).style.color= 'red';
    parrafo.appendChild(inactivo);
  }
}
//TODO removeChild activo inactivo
function textoEstado(){
var checkbox= document.getElementById("estadoServicio");

var parrafo= document.createElement("p");
var parrafo1= document.createElement("p");
var tdCheckbox= document.getElementById("tdCheckbox");
var activo= document.createTextNode("Activo");
var inactivo= document.createTextNode("Inactivo");

if(checkbox.checked){
    
    tdCheckbox.appendChild(parrafo).style.color= 'green';
    parrafo.appendChild(activo);    
}
else
    {
    parrafo.removeChild(parrafo.childNodes[0]);
    tdCheckbox.appendChild(parrafo1).style.color= 'red';
    parrafo1.appendChild(inactivo);
}

}

//TODO removeChild activo inactivo
function textoEstado(){
var checkbox= document.getElementById("estadoServicio");

var parrafo= document.createElement("p");
var tdCheckbox= document.getElementById("tdCheckbox");
var activo= document.createTextNode("Activo");
var inactivo= document.createTextNode("Inactivo");

if(checkbox.checked){
    
    tdCheckbox.appendChild(parrafo).style.color= 'green';
    parrafo.appendChild(activo);    
}
else
    {
    parrafo.removeChild(parrafo.childNodes[0]);
    tdCheckbox.appendChild(parrafo).style.color= 'red';
    parrafo.appendChild(inactivo);
   }
}
function textoEstado() {
  var checkbox = document.getElementById("estadoServicio");

  var parrafo = document.createElement("p");
  var tdCheckbox = document.getElementById("tdCheckbox");
  var activo = document.createTextNode("Activo");
  var inactivo = document.createTextNode("Inactivo");

  if (checkbox.checked) {

    tdCheckbox.appendChild(parrafo).style.color = 'green';
    parrafo.appendChild(activo);
  } else {

    tdCheckbox.appendChild(parrafo).style.color = 'red';
    parrafo.appendChild(inactivo);
  }
}
//TODO removeChild activo inactivo
function textoEstado() {
  var checkbox = document.getElementById("estadoServicio");

  var parrafo = document.createElement("p");
  var parrafo1 = document.createElement("p");
  var tdCheckbox = document.getElementById("tdCheckbox");
  var activo = document.createTextNode("Activo");
  var inactivo = document.createTextNode("Inactivo");

  if (checkbox.checked) {

    tdCheckbox.appendChild(parrafo).style.color = 'green';
    parrafo.appendChild(activo);
  } else {
    parrafo.removeChild(parrafo.childNodes[0]);
    tdCheckbox.appendChild(parrafo1).style.color = 'red';
    parrafo1.appendChild(inactivo);
  }
}
//TODO removeChild activo inactivo
function textoEstado() {
  var checkbox = document.getElementById("estadoServicio");

  var parrafo = document.createElement("p");
  var tdCheckbox = document.getElementById("tdCheckbox");
  var activo = document.createTextNode("Activo");
  var inactivo = document.createTextNode("Inactivo");

  if (checkbox.checked) {

    tdCheckbox.appendChild(parrafo).style.color = 'green';
    parrafo.appendChild(activo);
  } else {
    parrafo.removeChild(parrafo.childNodes[0]);
    tdCheckbox.appendChild(parrafo).style.color = 'red';
    parrafo.appendChild(inactivo);
  }
}
Origen Enlace
berlot83
  • 646
  • 2
  • 10
  • 25

Cambiar un elemento texto del DOM por otro mediante Javascript

Tengo un checkbox que cuando lo dejo checked quiero que diga Activo en verde, y cuando lo dejo desbloqueado quiero que diga inactivo, el tema es así, por javascript hice que cuando se checkea diga en verde activo, y cuando se descheckea diga inactivo, mi problema es que cada vez que deschequea me crea un elemento nuevo, he intentado con removeChild y replaceChild y no logro hacer que desaparezca el texto activo y aparezca el inactivo.

Este es el código base:

function textoEstado(){
var checkbox= document.getElementById("estadoServicio");

var parrafo= document.createElement("p");
var tdCheckbox= document.getElementById("tdCheckbox");
var activo= document.createTextNode("Activo");
var inactivo= document.createTextNode("Inactivo");

if(checkbox.checked){
    
    tdCheckbox.appendChild(parrafo).style.color= 'green';
    parrafo.appendChild(activo);    
}
else
    {

    tdCheckbox.appendChild(parrafo).style.color= 'red';
    parrafo.appendChild(inactivo);
  }
}

Este es el código con unos intentos por hacer desaparecer el texto activo y que aparezca el inactivo sin que se la pase creando elementos:

//TODO removeChild activo inactivo
function textoEstado(){
var checkbox= document.getElementById("estadoServicio");

var parrafo= document.createElement("p");
var parrafo1= document.createElement("p");
var tdCheckbox= document.getElementById("tdCheckbox");
var activo= document.createTextNode("Activo");
var inactivo= document.createTextNode("Inactivo");

if(checkbox.checked){
    
    tdCheckbox.appendChild(parrafo).style.color= 'green';
    parrafo.appendChild(activo);    
}
else
    {
    parrafo.removeChild(parrafo.childNodes[0]);
    tdCheckbox.appendChild(parrafo1).style.color= 'red';
    parrafo1.appendChild(inactivo);
}

}

Tambien intente este otro y no va:

//TODO removeChild activo inactivo
function textoEstado(){
var checkbox= document.getElementById("estadoServicio");

var parrafo= document.createElement("p");
var tdCheckbox= document.getElementById("tdCheckbox");
var activo= document.createTextNode("Activo");
var inactivo= document.createTextNode("Inactivo");

if(checkbox.checked){
    
    tdCheckbox.appendChild(parrafo).style.color= 'green';
    parrafo.appendChild(activo);    
}
else
    {
    parrafo.removeChild(parrafo.childNodes[0]);
    tdCheckbox.appendChild(parrafo).style.color= 'red';
    parrafo.appendChild(inactivo);
   }
}

Ninguno de los dos me funciona, si sigo así le voy a tener que poner un alert, pero realmente sería un camino muy fácil ése, gracias por la atención.