1

私はこれを持っています：

document.getElementById('returning_user_search_box').style.backgroundColor='yellow';

そして今、次のようなスタイルを追加する必要があります:

マージン左:-280px; マージントップ:-280px; 最小幅: 550px;

私はこのようないくつかの組み合わせを試しましたが、成功しませんでした:

document.getElementById('returning_user_search_box').style.innerHTML='{margin-left:-280px; マージントップ:-280px; 最小幅: 550px;}';

どんな手掛かり ？

4

4 に答える 4

3

それらをすべて個別に設定する必要があります。

var style = document.getElementById('returning_user_search_box').style;

style.backgroundColor = 'yellow';
style.marginLeft      = '-280px';
style.marginTop       = '-280px';
style.minWidth        = '550px';
于 2013-08-22T20:44:27.573 に答える
0

それらをすべて個別に設定する必要があります。CSS クラスを作成し、JavaScript でクラスをバインドするだけです。もう 1 つのオプションは、マルチプロパティ CSS スタイルをサポートする jQuery を使用することです。

于 2013-08-22T20:46:20.003 に答える
0

要素のオブジェクトのcssTextプロパティを使用して、要素に複数のスタイルを設定できます。style既存のスタイルを壊さないように追加することもできます。

var style = document.getElementById('returning_user_search_box').style;

style.cssText += "margin-left: -280px; min-width: 550px;";

http://jsfiddle.net/hQnTX/1/

あなたが持っているオブジェクトをループして（ちなみにこれは構文的に正しくありません）、プロパティを個別に割り当てることもできます：

var properties = {"margin-left":"-280px", "margin-top":"-280px", "min-width": "550px"},
for (prop in properties) {
    if (properties.hasOwnProperty(prop)) {
        style[prop] = properties[prop];
    }
}

http://jsfiddle.net/hQnTX/

于 2013-08-22T20:53:52.067 に答える
0

一般的な経験則では、CSS属性foo-barはJavaScriptプロパティfooBarになり、前のハイフンは削除されます (例: for -webkit-*)。

これは、簡単な変換関数を作成できることを意味します

function toJSProp(cssAttrib) {
    return (
        cssAttrib
            .replace(/^-+/, '')
            .replace(/-([a-z])/g, function ($0, $1) {
                return $1.toUpperCase();
            })
    );
}

次に、オブジェクトをループする関数を作成し、特定の要素のスタイルをそのプロパティに設定します

function style(element, cssObject) {
    var i;
    for (i in cssObject) element.style[toJSProp(i)] = cssObject[i];
}

オブジェクトを簡単に渡すことで、多くのスタイルを適用できるようになりました

style(document.body, {
    'color': 'red',
    'background-color': 'black'
});
于 2013-08-22T20:55:40.183 に答える