aa.style.fontSize="30px";
aa.setAttribute('style','color:red');
效果如下:
aa.style.color="red";
aa.setAttribute('style','font-size:30px');
效果如下:
aa.setAttribute("style","font-size:30px");
aa.setAttribute("style","color:red");
效果如下:
都没有达到预期的效果。
为什么setAttribute("style","font-size:30px");类似的用法不管用,达不到效果呢??
aa..width="100px";aa.setAttribute("width","200px");是后一个覆盖了前面那一个;aa.setAttribute("style","color:red")的意思:把aa的style(行内样式)替换成color:red,原有的全部清除;它把style当成时一个属性一次性操作了;
<div id="aa" style="font-size:30px;color:blue;text-indent:20px;"></div> 执行aa.setAttribute("style","color:red"),就变成这样了<div id="aa" style="color:red;"></div>;;
aa.style.fontSize="30px";的意思把style属性中的fontSize属性赋值为30px;
上图修改:
1.
aa.setAttribute('style','color:red');
aa.style.fontSize="30px";
2.
aa.setAttribute('style','font-size:30px');
aa.style.color="red";
3.
aa.setAttribute("style","color:red;font-size:30px");
这样应该就有你要的效果了
setAttribute(); 是assgin的 前一个的内容不保留
除非你setAttribute("style","{"font-size":"30px","color":"red"}");