Question

这是我的函数集css属性，如jquery

that.getNode = function() {
    return element;   // element is HTML node
};    


that.css = function(obj) {
    var node = that.getNode(),
        attr;
    if (node && node.style) {
        for (attr in obj) {
            if (obj.hasOwnProperty(attr) && node.style.hasOwnProperty(attr)) {
                node.style[attr] = obj[attr];
            }
        }
    }
    return that;
};

然后我打电话，它通常在Chrome上运行，但无法在IE9或Firefox上运行

that.css({
    border: "1px solid black"
});

Answer 1

在某些浏览器中，似乎以下内容返回false：

node.style.hasOwnProperty(attr)

在这些情况下，prototype（Object）本身会从node.style而不是拥有的继承这些属性。

如果您想测试该属性是否存在，无论是拥有还是继承，您可以尝试in operator：

attr in node.style

在上下文中：

that.css = function(obj) {
    var node = that.getNode(),
        attr;
    if (node && node.style) {
        for (attr in obj) {
            if (obj.hasOwnProperty(attr) && attr in node.style) {
                node.style[attr] = obj[attr];
            }
        }
    }
    return that;
};

Answer 2

手动制作 Cross-browser 解决方案需要做很多工作，我建议使用一些像JQuery这样的JavaScript框架，它会为您付出艰苦的努力。

如果您选择JQuery，您有一个名为.CSS的函数，您可以在一行中完成此任务，例如：

您有一个HTML元素：

<div id="someID"> Content </div>

正确？所以你想要为这个DIV添加一些CSS类，你只需要告诉JQuery HTML DOM中的哪个节点想要选择并使用函数.CSS你可以设置一些CSS属性（以及其他东西）：

$("#someID").css("SOME-ATTRIbute","SOME-VALUE");

（＃someID是元素的ID，.CSS是函数）

easy eh ?,使用JQuery或任何其他Javascript框架来帮助您进行跨浏览器应用程序。

PS：对不起我的英文

在javascript中设置css属性

2 个答案: