Question

我有一个对象dom，它有一个名为changeCss的属性，可以更改任何元素的css：代码如下：

var Dom = {
 changeCss : function(element, properties){
            if(typeof (properties) === "object"){

                var properties_name = Object.keys(properties),
                     properties_value = [];

             for ( var i = 0; i < properties_name.length ; i++  ){
                 var a = properties_name[i],
                  b = properties[a];

                  properties_value[i] = b;

                  element.setAttribute("style", a+":" + b+";");

             };

            }else{
                throw 'properties of '+ element +" should be object";  
            }   
        },  
}

所以从这段代码中你将会理解我是如何改变任何元素的css的，这是完美的。但我面临的问题是，如果我正在编写这段代码：

var x = document.getElementById("some_html_tag_id");
Dom.changeCss(x, {"width": "100px", "height":"80px"});

那么样式元素只包含height:80px而不是width:100px！如何添加所有这些样式属性？

感谢

anni

Answer 1

首先替换

element.setAttribute

与

element.style[a]= b;

但基本上你应该明白你的意思。 SetAttribute函数设置属性样式的新值。所以而我= = 0 风格=＆＃39;宽度：100像素;＆＃39; 而我== 1 style =＆＃39; height：80px;＆＃39;

因为你只是覆盖了价值。如果要在代码中保留SetAttribute函数。您需要先连接所有值，然后使用set attribute

Answer 2

在DOM中。 style属性不是字符串。它是一个对象。这意味着你应该这样做：

element.style.setProperty(a,b);

但是，旧版本的IE不支持setProperty样式对象。因此，即使上述技术上符合标准的方式，有效的保证跨行方法是：

element.style[a] = b;

请注意，对于您认为需要setProperty或setAttribute的每个实例，object[x] = y语法也适用，并且在样式的情况下始终向后兼容（更不用说要求少输入）。

为什么javascript函数无法正常运行

2 个答案: