js - remplazando clases

by Alejandro M

HTML

<div id="theID" class="red  gray">
  as
</div>

CSS

.red{color:red;}
.blue{background:blue;}
.gray{text-decoration:underline;}

JavaScript

//document.getElementById("theID").removeAttribute("class"); //remueve todas
document.getElementById("theID").getAttribute("class");//lee el atributo
//document.getElementById("theID").setAttribute("class", "blue");// pisa las anteriores
//document.getElementById("theID").className = "blue";// pisa las anteriores

//document.getElementById("theID").className =
//document.getElementById("theID").className.replace(/\bMyClass\b/,'');
//document.getElementById("theID").className.replace(/(\s|^)red(\s|$)/, ' ')

//document.getElementById("theID").classList.add("blue");//desde explorer 10 recien
//document.getElementById("theID").classList.remove("foo");//desde explorer 10 recien

//agregando una clase (agrego blue)
var string = document.getElementById("theID").getAttribute("class");
document.getElementById("theID").setAttribute("class", string + " blue");
document.getElementById("theID").innerHTML = string + " blue";//solo para mostrar

//removiendo una clase (remuevo gray)
var string = document.getElementById("theID").getAttribute("class");
var new_string = string.replace("gray", "");//el segundo no lo incluye
document.getElementById("theID").setAttribute("class", new_string);
document.getElementById("theID").innerHTML = new_string;//solo para mostrar

//replace
"data-123data-".replace('data-','');
//"123data-"
"data-123data-".replace(/data-/g,'');
//"123"

//slice
var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1, 3);//el segundo no lo incluye
// Orange,Lemon

//substring
var str = "Hello world!";
var res = str.substring(1, 4);//el segundo no lo incluye
//ell

//split
var str = "How are you doing today?";
var res = str.split(" ");
//How,are,you,doing,today?


//search
var str = "Visit W3Schools!";
var n = str.search("W3Schools");
//6