javascript - 存储/检索 CSS 元素

Question

我正在 Web 中使用 FormDesigner:HTML5 + CSS3 + jQuery，借此我可以将(div、文本框等)拖到表单上并单独更改它们的 css 样式。

---

我的要求:如何分别存储每个属性，以便我可以轻松地独立检索？ (通用、可重用、灵活)

background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#666666), to(#666666), color-stop(0, #333333))

---

我是这样做的:(代码片段)

            cssObj[id] = {};
            cssObj[id].background = {};
            cssObj[id].background.webkitGradient = {};
            cssObj[id].background.webkitGradient.linear = {};
            cssObj[id].background.webkitGradient.linear.hPosStart = hPosStart;
            cssObj[id].background.webkitGradient.linear.vPosStart = vPosStart;
            cssObj[id].background.webkitGradient.linear.colorStart = colorStart;
            cssObj[id].background.webkitGradient.linear.hPosEnd = hPosEnd;
            cssObj[id].background.webkitGradient.linear.vPosEnd = vPosEnd;
            cssObj[id].background.webkitGradient.linear.colorEnd = colorEnd;
            cssObj[id].background.webkitGradient.linear.colorStop = {};
            cssObj[id].background.webkitGradient.linear.colorStop = colorStopArr;

我以jSon的方式存储它们，但不知何故我认为应该有更先进或更有效的方法，比如有一个Class/Attributes/Methods，这样我可以以通用、可重用和灵活的方式存储它们。

Answer 1

我认为你走的路是对的。但是 jQuery 1.8 引入了 vendor 前缀支持，这也许可以帮助您。

我认为您不需要指定类来动态修改元素的 CSS。然而，CSS-class-definitions 可以在保存表单时用于您的导出格式。使用 jQuery，您应该能够在 .css() 方法中传递 JSON 对象；这样就不需要每一行的特定代码。

Vendor-Prefixed CSS Properties

The W3C had its heart in the right place when it came up with the idea to use vendor prefixes for CSS features that were not yet standardized, but it hasn’t resulted in a fairy-tale ending. Web developers are faced with the nightmare of including all the vendor-prefixed property names in stylesheets. jQuery 1.8 eases the pain a bit. We automatically take the non-prefixed property name and generate the prefix that is appropriate for the current browser, so you don’t have to. For example, on Chrome the jQuery call $("#myscroll").css("marquee-direction", "backwards") will set the CSS to -webkit-marquee-direction: backwards.

http://blog.jquery.com/2012/06/22/jquery-1-8-beta-1-see-whats-coming-and-going/