1

重複の可能性:
CSS での Javascript の使用

javascriptcss でコードを使用することは可能backgroundですか?
このような意味：

style="background:url(javascript:---javascript コード---);" この構文は機能しますか?

前もって感謝します

4

3 に答える 3

3

CSS内でJavaScriptを使用することはできません。ただし、JavaScriptを使用して背景画像を変更する場合は、次の行が機能します。

document.getElementById("<element ID>").style.backgroundImage = "url(<url of image>)";
于 2012-05-20T16:34:49.437 に答える
2

JavaScriptを使用したスタイル属性へのアクセス

CSSでJavaScriptを使用することはできませんが、JavaScriptを使用してCSSルールを設定することはできます。例えば：

// Create CSS BackgroundImage Rule
var bg = "url('http://placekitten.com/200/300)";

// Apply Rule
document.getElementById("foo").style.backgroundImage = bg;

CSSで変数と関数を可能にする

さらに、 SASSやLESSなどのCSSで関数や変数を使用できるようにする一連のフレームワークとツールがあります。

IEの古い（そして2008年以来死んでいる）動的プロパティ

CSSにJavaScriptを含めるのに最も近いのは、動的プロパティ（IE5で導入）です。これは、クロスブラウザーのサポートが非常に貧弱で、最新バージョンのIEではサポートされなくなりました。

jQueryを使用した迅速で簡単なCSS変更

JavaScriptを使用してスタイルに多くの変更を加える必要がある場合、一般的に、多くの人がそれを支援するフレームワークを採用する方向に進んでいます。たとえば、人気のあるフレームワークの1つはjQueryで、次のようなことができます。

$("#foo").css('background-color', 'red');

オブジェクトを介した一括割当と同様に：

var color  = "#ffe", 
    border = "5px solid #ccc";

$("#foo").css({ 'background-color': color, 'border-left': border });
于 2012-05-20T16:34:47.327 に答える
1

技術的にはそうです、次の式があります。

background: expression(JS code resulting in a vali background image string here)

ただし、これはIEでのみ機能すると思います。コードを毎秒数百回再評価する必要があるため、非常に悪い習慣です。

代わりに、そこに適切なデフォルトを設定し、ページの後半でJavaScriptを使用して変更する必要があります。

于 2012-05-20T16:36:20.453 に答える