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 を a に入れて、textareaこれを秒に変換したい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

実際、探しているコードは非常に簡単に見つけることができますが、間違ったものを探している可能性があります。

私のコードをあなたと共有したいと思いますが、それは最小化されたコードのような形式で書かれています.最小化せずにフレームワーク全体を指ぬきに詰め込むことはできますが、それを結婚したくない人にとっては少し混乱する傾向があります. . ただし、20 または 40 のキーストロークを 4 ~ 5 回のキーストロークで書き込むことができるので、本当に楽しいデートになります。

私は、その場でそれを処理するので、特にブラウザーのプレフィックスを気にせずに CSS を使用できるようにするコードのセクションを持っていますが、モダナイザーや、同様のタスクを実行するその他のさらに CSS 固有のツールのようなものがあります。そのソース コードはおそらく、必要なパーサーを略奪するのに非常に簡単です。

私は、以前のコンパクトではないバージョンの 1 つからこのビットを持っています。正規表現は、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 に答える