ステータスDIVを編集しようとすると奇妙なエラーが発生します。TypeError:未定義の 'backgroundColor'プロパティを設定できません
styleBox()関数は、colorとbackgroundColorを変更してステータスDIVを編集する必要があります。
:しかし、私はこのエラーを取得する機能を実行するたび:私が正しくdiv要素を選択していた場合、私が見たとき、私は未定義のエラーを得ることはありませんのでTypeError: Cannot set property 'backgroundColor' of undefined
それは私には意味がありません。
document.getElementById('status');
>> <div id="status" style></div>
ステータスDIVの「スタイル」とは関係がありますが、進める方法がわからないと思います。私はhereを見たが、それはIDではないクラスを選択することと関係がある。
私のコードは以下の通りです:
<!DOCTYPE html>
<html>
<head>
<title>
Day 11 - Functions Visuals
</title>
<style>
#box {
width:200px;
height:200px;
background-color:black;
}
</style>
</head>
<body>
<div id="group">
<button id="blue">Blue</button>
<button id="red">Red</button>
<button id="green">Green</button>
<div id="status" style=""></div> << -- This is what is tripping me up
</div>
<div id="box"></div>
<script type="text/javascript">
// Create variables for each id
blueButton = document.getElementById('blue');
redButton = document.getElementById('red');
greenButton = document.getElementById('green');
status = document.getElementById('status');
box = document.getElementById('box');
function styleBox() {
box.style.width = "50px";
box.style.height = "50px";
status.innerHTML = "The box is changed";
status.style.backgroundColor = "#000000";
status.style.color = "#FFF";
};
</script>
</body>
</html>
status *と呼ばれるグローバル変数がhttps://developer.mozilla.org/en-US/docs/Web/API/Window/statusと競合する可能性があります。 –
ありがとう@JaromandaXあなたは正しいです。私は予約された名前リストhttps://www.w3schools.com/js/js_reserved.aspについて知らなかった – Chef1075