Javascript 向自定义可重用函数添加css

我在jQuery中创建了一个函数，它允许我创建一个lightbox，如下所示：

var lightbox = create_lightbox(params);

我想扩展这个功能，这样我就可以添加自定义css到它，使它看起来像在任何给定的情况下的感觉。我希望能够做到以下几点：

    lightbox.css = {
    "background-color" : "red",
    etc...

}

做这件事的最佳方式是什么？我将如何迭代函数中的css元素

---

tyvm

创建一个函数来获取一个对象，该对象包含要添加到lightbox的css属性中的所有值，然后使用jQuery的extend添加默认值

function create_lightbox(params, css){
    css = $.extend({ "background-color": "default val"}, css);

    lightbox.css = css;
}

如果您真的想循环css中的所有属性，可以使用for-in循环

function create_lightbox (params, css) {
   css = $.extend({ "background-color": "default val"}, css);

   for (cssKey in css)
     lightbox.css[cssKey] = css[cssKey];
}

---

只要使用CSS，因为CSS应该被使用：在-tag或链接的.CSS文件中。lightbox插件使用以下dom树：

<div id="jquery-lightbox">
    <div id="lightbox-container-image-box">
        <div id="lightbox-container-image">
            <img id="lightbox-image" />
            <div id="lightbox-nav">...</div>
        </div>
    </div>
</div>

...

---

那么，你想做什么就做什么。我猜您不想在每个方框上使用不同的样式？

您可以向lightbox类添加元素属性，以便修改构造函数中的值：

function lightbox() {
    this.element = document.ccreateElement("div")
    this.light = "light";
    this.box = "box";
}

var newLightBox = new lightbox();
newLightBox.element.style.background = "#000";