Tu script
Cita: ventana.document.body.setAttribute("style").backgro undColor=color;
En los manuales vemos que setAttribute() recibe dos parametros, nombre y valor
elementNode.setAttribute(name,value)
El problema de style es que no es un attributo normal, nombre/valor, sino que se podria ver como un array de valores con su nombre.
Código HTML:
Ver original<div id="unDiv" style="position:absolute;z-index:0;text-align:right; width:100%">
si tienes esto y haces
Código Javascript
:
Ver originaldocument.getElementById("unDiv").setAttribute("style","background-color: blue;");
funcionará pero pasara a
con lo que quizas pierdes algo. En cambio si haces
Código Javascript
:
Ver originaldocument.getElementById("unDiv").style.backgroundColor="blue";
ahora será
Código HTML:
Ver original<div id="unDiv" style="position:absolute;z-index:0;text-align:right; width:100%;background-color: blue;">
mejor, no?
Y la ultima opción que mencionas getAttribute() leemos en el manual
Cita: Syntax
var attribute = element.getAttribute(attributeName);
where
attribute is a string containing the value of attributeName.
attributeName is the name of the attribute whose value you want to get.
copmo puedes ver el resultado es un string que contiene el valor del atributo solicitado, es una cadena de texto que si la cambias solo haces eso cambiar una cadena de texto.
Que mejor que unos ejemplos
Código HTML:
Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript"> function cambiaColor1(){
document.body.style.backgroundColor="red";
}
function cambiaColor2(){
document.body.setAttribute("style","background-color: blue;");
}
function cambiaColor3(){
var v = document.body.getAttribute("style");
alert(v);
if(v!="background-color: green;"){
v="background-color: green;";
}else{
v="background-color: yellow;";
}
document.body.setAttribute("style",v);
}
<input name="bot1" type="button" id="bot1" onClick="cambiaColor1();" value="document.body.style.backgroundColor" /> <input name="bot2" type="button" id="bot2" onClick="cambiaColor2();" value="setAttribute" /> <input name="bot3" type="button" id="bot3" onClick="cambiaColor3();" value="getAttribute+alert+setAttribute" />
(en FIREFOX funciona)
Edito: @zerokilled sabe más que yo y es mas rapido, por suerte no nos contradecimos del todo.