JavaScriptを使って色を変える方法-フロントエンドQ&A-php.cn

JavaScriptを使って色を変える方法

青灯夜游

リリース： 2022-01-23 18:19:04

オリジナル

9180 人が閲覧しました

JavaScript を使用して色を変更する方法: 1. "element object.style.color = "color value";" ステートメントを使用してテキストの色を変更します。 2. "element object.style.backgroundColor" を使用します。 = "color value" ";" ステートメントは背景色を変更します。

JavaScriptを使って色を変える方法

このチュートリアルの動作環境: Windows7 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。

JavaScript を使用して色を変更します

1. Style オブジェクトの color プロパティを使用してテキストの色を変更します

color 属性はテキストの色を設定します。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
	</head>
	<body>
		<div id="box">元素内容</div><br />
		<button onclick="myFunction()">改变文本颜色</button>
		<script>
			function myFunction() {
				var box = document.getElementById("box");
				box.style.color = "red";
			}
		</script>
	</body>

</html>

ログイン後にコピー

JavaScriptを使って色を変える方法

2. Style オブジェクトの backgroundColor プロパティを使用して背景色を変更します。

backgroundColor プロパティは背景を設定できます。要素の色。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
	</head>
	<body>
		<div id="box">元素内容</div><br />
		<button onclick="myFunction()">改变背景颜色</button>
		<script>
			function myFunction() {
				var box = document.getElementById("box");
				box.style.backgroundColor = "red";
			}
		</script>
	</body>

</html>

ログイン後にコピー

JavaScriptを使って色を変える方法