CSSの文字列でstyleを指定したい
割と有名なのでスルーしてもいいかも。
prototype.jsを使ってる人には有効かなあ。
そもそもprototype.jsのElement.setStyleは引き数がobjectなので
var styleObj = { 'height' : '20px', 'width' : '200px' /* .... */ } Element.setStyle('hoge', styleObj);
といった感じなんだけど、objectに直すのがちとめんどい。
デザイナさんからもらったりしらCSSの文字列をそのまま渡せたらもっと楽な気がする。
でパースしてまえと。
function parseStyle(style){ var styles = style.split(';'); var re = /^\s*([a-zA-Z\-_0-9]+)\s*:\s*(\S(.+\S)?)\s*$/; var obj = {}; for(var i = 0; i < styles.length; i++){ var parts = re.exec(styles[i]); if(parts){ obj[parts[1]] = parts[2]; } } return obj; }
これだと
var styleObj = parseStyle('position: absolute;background: #fff;color:#000000;') Element.setStyle('hoge', styleObj);
と少しスッキリする。
まあsetStyleに仕込めばもっとスッキリかなあ。
まあでも大量に仕込むのであればjavascriptでCSSをいじった方がもっといいよね。
うくく。