JavaScript で背景色を変更する

2023-08-12 17:14| 来源: 网络整理| 查看: 265

このチュートリアルでは、JavaScript の backgroundColor プロパティを使用して背景色を変更する方法について説明します。

JavaScript の backgroundColor プロパティを使用して背景色を変更する

Please enable JavaScript

JavaScript の backgroundColor プロパティを使用して背景色を変更できます。このプロパティを使用するには、背景色を変更する要素を取得する必要があります。次に、backgroundColor プロパティを使用して背景色を設定できます。

たとえば、HTML を使用してページを作成し、backgroundColor プロパティを使用して本文の背景色を緑に変更してみましょう。以下のコードを参照してください。

document.body.style.backgroundColor = 'green';

クラスの ID または名前を持つ要素を取得することもできます。ID を使用して要素を取得するには、getElementById() 関数を使用できます。そのクラスを使用して要素を取得するには、getElementsByClassName() 関数を使用できます。

たとえば、ID で要素を取得し、backgroundColor プロパティを使用して背景色を変更してみましょう。以下のコードを参照してください。

Hello Wold document.getElementById('myID').style.backgroundColor = 'green';

上記のコードは、ID が myID の要素の背景色のみを変更し、全身セクションは変更しません。また、色名を使用して要素を変更する代わりに、さまざまな色のカラーコードを使用して要素の背景色を変更します。

ボタンを使用してテキストの背景色を変更するコードを書いてみましょう。以下のコードを参照してください。

Change Color Hello World function Mycolor() { var element = document.getElementById("myID"); element.style.backgroundColor='#900'; }

このコードでは、ボタンとテキストが表示されます。ボタンを押すと、テキストの背景色が指定された色に応じて変化します。

【本文地址】

公司简介

联系我们