JavaScript と条件文を使用して Div の背景画像を動的に変更する方法

JavaScript で div 要素の背景画像を変更する方法

質問:

背景を変更したいと考えています。 JavaScript と条件文を使用したクラス名「ghor」の div 要素の画像。ただし、el.url を使用して画像ソースを確認および変更しようとすると、現在のコードではエラーが表示されます。

説明:

背景画像を動的に変更するにはJavaScript を使用して div 要素を取得するには、次のコードを利用できます:

<code class="js">document.getElementById("a").style.backgroundImage = "url(image_path.jpg)";</code>

この場合、コードは次の div 要素をターゲットにします。 ID「a」を指定し、backgroundImage プロパティを指定された画像パスに設定します。

If-Else 条件を含む改訂コード:

変更のための if-else 条件を実装するには特定の条件に基づいて背景画像を表示するには、次のようにコードを変更できます。

<code class="js">var el = document.getElementById("a");
if (el.style.backgroundImage.includes("Black-Wallpaper.jpg")) {
  el.style.backgroundImage = "url(cross1.png)";
} else if (el.style.backgroundImage.includes("cross1.png")) {
  alert("This is working too.");
}</code>

この改訂されたコードは、背景画像が「ghor」クラスの div は「Black-Wallpaper.jpg」または「cross1.png」に設定され、それに応じて変更されます。どちらの条件も満たされない場合、「これも機能しています。」という警告メッセージが表示されます。と表示されます。

以上がJavaScript と条件文を使用して Div の背景画像を動的に変更する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。