从javascript(而不是单个样式参数)将整个样式字符串设置为元素

时间:2009-06-11 14:57:39

标签: javascript css stylesheet

我需要通过javascript将任意样式设置为span。

我知道我可以这样做:span.style.height="250px"; 但我需要能够从模板中插入随机的完整样式定义

例如

float:left; 
text-decoration:underline; 
cursor:pointer; 
color:blue;

有没有办法在Javascript中这样做?类似的东西:

element.style="all style definition here";

3 个答案:

答案 0 :(得分:44)

.style.cssText属性怎么样? Here's Microsoft's explanation.

将您想要应用的样式扔出去:

document.getElementById('myEl').style.cssText = 'float:left;margin-top:75px;';

至于浏览器支持,虽然它是IE专有的,但我相信它得到了很好的支持(至少可以在IE,FF3和Safari 3.2 WIN中使用)。

答案 1 :(得分:8)

如果您希望它是轻量级的,请创建一个函数,例如:

function setStyles(element, styles)
{
    for(var s in styles) {
        element.style[s] = styles[s];
    }
}

然后你将样式作为对象文字传递:

setStyles(element, {float: "left",
                    textDecoration: "underline",
                    cursor: "pointer",
                    color: "blue"});

请注意,传入的样式引用必须遵循JavaScript立场的命名,因为该函数只是通过JavaScript访问元素的style对象来更改样式。

如果你必须从字符串中获取样式输入,那么你可以很容易地解析它并创建对象文字。

答案 2 :(得分:2)

element.setAttribute('style', '...');,但在IE中失败。

a solution,但我还没试过。