前提・実現したいこと
プログラミングスクールの課題を行っています。イベントハンドラについての課題です。
以下、課題文です。
「「背景黒」ボタンを押すと、ページ全体の背景色が黒で文字色が白、「背景白」ボタンを押すと、ページ全体の背景色が白で文字色が黒となるようプログラムを追記してください。」
元のHTML
(script部分に書き足すことで、上記の要件を満たすプログラムを作成します)
HTML
1<!DOCTYPE html> 2<html lang="ja"> 3<head> 4 <meta charset="UTF-8"> 5 <title>実行タイミング</title> 6 <script> 7 /* 課題処理を追加 */ 8 </script> 9</head> 10<body> 11 <p>ボタンクリックにより背景色と文字色を変化</p> 12 <button id="black">背景黒</button> 13 <button id="white">背景白</button> 14</body> 15</html>
発生している問題・エラーメッセージ
ボタンを押しても、何も起こらない。
該当のソースコード
script部分のみで失礼します。
Javascript
1 2 <script> 3 /* 課題処理を追加 */ 4 function background_black() { 5 document.style.color = '#000000'; 6 document.style.backgroundColor = '#FFFFFF'; 7 } 8 function background_white() { 9 document.style.color = '#FFFFFF'; 10 document.style.backgroundColor ='#000000'; 11 } 12 window.onload = function() { 13 var bgBlack = document.getElementById('black'); 14 var bgWhite = document.getElementById('white'); 15 bgBlack.addEventListener('click', background_black, false); 16 bgWhite.addEventListener('click', background_white, false); 17 } 18 </script>
ご教示お願いいたします。
回答3件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。