3

我想像这样转换一些CSS：

body {
    margin: 0 auto;
    padding: 10px 0;
}

#content {
    background: #ffffff;
}

变成这样的 XML 结构：

<class name='body'>
<param name='margin'>0</param>
<param name='padding'>10px</param>
</class>

<class name='#content'>
<param name='background'>#ffffff</param>
</class>

我想将 CSS 放入 atextarea并让它转换为 second textarea。这可能吗？

我的想法是将代码拆分成一个数组；数组中的每个类或 id 及其属性：

array [0][0][0] = body
array [0][1][0] = margin
array [0][1][1] = 0
array [0][2][0] = padding
array [0][2][1] = 10px 0
array [1][0][0] = #content
array [1][1][0] = background
array [1][1][1] = #ffffff
4

2 回答 2

0

实际上，您要查找的代码很容易找到，但很可能您只是在寻找错误的东西。

我会和你分享我的代码，但它是以一种看起来像最小化代码的形式编写的，虽然允许我在不最小化的情况下将整个框架塞进一个顶针，但对于那些不想嫁给它的人来说往往会有点混乱. 虽然，能够用 4 到 5 次击键写出 20 或 40 次击键，这使它成为一个真正有趣的约会。

我有一段代码允许我使用 CSS 而无需担心浏览器前缀，因为它可以即时处理这些内容，但也有诸如 Modernizer 和其他更特定于 CSS 的工具之类的东西可以执行类似的任务和其源代码可能很容易从您需要的解析器中窃取。

我确实从我的一个较旧的不太紧凑的版本中获得了这一点，这可能会对您有所帮助。正则表达式是将 CSS 分解为属性和值的一部分，虽然有点旧，但应该仍然有用。

for 循环的主体有一些依赖关系，但实际上只是为了让您了解如何使用旧的正则表达式。新版本并没有什么不同，但代码变得如此紧凑，几乎不可能从中提取类似的样本。想想看，循环所在的整个部分都被归结为比这个循环更小。

RegExp(/(?:(?:[{;]{1,1})(?:[$]{0,})(?:[\s$\n\t]{0,}){0,})([-a-z]{1,1}[-a-z_0-9]{1,}?)(?=[ \t]{0,}[:])/gim)


for(;(a_prop=rx.rx_props.exec(s_textContent));)
{var    prop_in=(a_prop||[null,null])[1],prop_out=_.vcss$(prop_in,'-');
if(prop_in!=prop_out)
    {s_textContent=s_textContent.substr(0,rx.rx_props.lastIndex-    prop_in.length)+prop_out+s_textContent.substr(rx.rx_props.lastIndex);
        }
}
于 2013-05-11T04:10:51.617 回答
0

IMHO it would make more sense to convert it into the following XML.

<style>
  <body margin="0 auto" padding="10px 0"/>
  <any id="content" background="#ffffff"/>
</style>

Note how the attributes id and class (not in your example) are treated differently to other attributes. Note the new tagname any. And finally, note that nested CSS styles like

table.a td {border:thin solid black; margin:1px}

translate naturally into child nodes.

<table class="a">
  <td border="thin solid black" margin="1px"/>
</table>
于 2018-06-10T03:33:23.013 回答