ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScriptの背景画像をインポートする方法

JavaScriptの背景画像をインポートする方法

藏色散人
藏色散人オリジナル
2021-06-18 11:55:356332ブラウズ

JavaScript 背景画像をインポートする方法: まず新しい HTML ファイルを作成し、div を使用してモジュールを作成します。次に、css タグの ID を使用して div のスタイルを設定し、次に onclick クリック イベントをbutton button; 最後に、 setBg() 関数で背景画像のインポートを実装するだけです。

JavaScriptの背景画像をインポートする方法

この記事の動作環境: Windows7 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。

JavaScript の背景画像をインポートするにはどうすればよいですか?

test.html という名前の新しい HTML ファイルを作成して、背景画像を js にインポートする方法を説明します。

JavaScriptの背景画像をインポートする方法

test.html ファイルで、div を使用して背景画像をインポートするモジュールを作成します。

JavaScriptの背景画像をインポートする方法

css タグで、ID を使用して div のスタイルを設定し、幅と高さを 300 ピクセル、境界線を 1 ピクセルとして定義します。

JavaScriptの背景画像をインポートする方法

test.html ファイルで、button タグを使用してボタンを作成し、onclick クリック イベントを button ボタンにバインドし、ボタンがクリックされたときに、 setBg()関数。

JavaScriptの背景画像をインポートする方法

js タグ内に setBg() 関数を作成し、その関数内で id を介して div オブジェクトを取得し、その関数の backgroundImage 属性に値を割り当てます。背景画像を実現するためのstyle属性をインポートします。たとえば、2.jpg 画像へのパスがここに割り当てられます。

JavaScriptの背景画像をインポートする方法

test.html ファイルをブラウザで開き、ボタンをクリックして結果を表示します。

JavaScriptの背景画像をインポートする方法

JavaScriptの背景画像をインポートする方法

推奨学習: 「JavaScript 上級チュートリアル

以上がJavaScriptの背景画像をインポートする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。