2

我正在开发 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，以便我可以以通用、可重用和灵活的方式存储它们。

4

1 回答 1

1

I think you're going the right way. But jQuery 1.8 introduces vendor prefix support, which maybe could help you.

I don't think you need to specify classes to dynamically modify the CSS of an element. However, CSS-class-definitions could be used in your export-format when saving the form. And with jQuery you should be able to pass in JSON objects in the .css()-method; that way to do not need specific code for each line.

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/

于 2012-07-02T10:36:00.897 回答