カテゴリー: 練習問題(DOM操作/イベント操作)

課題内容 ＜概要＞ 　ボタンを３つ用意しましょう。 　ボタンはそれぞれ、順番として、 　１つ目 　２つ目 　３つ目 　がわかるようにボタンを準備します。 　初期表示は１つ目だけ、色が変わった状態にします。 　動きは、３つの中で、色が変わるのは１つだけで、 　押されたボタン：背景色を赤色、文字を白色に変更 　押されたボタン以外：初期の背景色は白色、文字は黒色に変更 　という動きをつけましょう。 　 …

さらに表示 課題【練習問題（DOM操作/イベント操作）】ーNo.007

課題内容 ＜概要＞ 　サイズが横200px/縦200pxで、 　枠線がついたdivタグを３つ用意しましょう。 　divの順番として、 　div１つ目：赤色 　div２つ目：青色 　div３つ目：黄色 　として動きをつけます。 　動きは、マウスのカーソルの動きによって、 　divの背景色を変える動きをします。 　マウスカーソルの動きで、 　divタグにカーソルが当たる：背景色をつける 　divタグか…

さらに表示 課題【練習問題（DOM操作/イベント操作）】ーNo.006

課題内容 ＜概要＞ 　サイズが横200px/縦200pxで、 　枠線がついたdivタグを３つ用意しましょう。 　それぞれのdivタグの下に、 　ボタンを２つ用意しましょう。　 　ボタン１つ目：「リセット」という文字のボタン。 　ボタン２つ目：「XX色に変更」という文字のボタン。 　（XXは、赤、青、緑を順番に） 　表示としては、divタグと２つのボタンがセットで、 　このセットを３つ用意する形にな…

さらに表示 課題【練習問題（DOM操作/イベント操作）】ーNo.005

課題内容 ＜概要＞ 　数値を入力するためのinputタグを準備しましょう。 　そのinputタグは、typeをnumberにしておきましょう。 　inputタグの初期値として「1」を設定しましょう。　 　これとは別に、２つのボタンを用意しましょう。 　１つ目：「実行」という文字のボタン。 　２つ目：「リセット」という文字のボタン。 　この２つのボタンを用意して、 　それぞれのボタンが押された時に、…

さらに表示 課題【練習問題（DOM操作/イベント操作）】ーNo.004

課題内容 ＜概要＞ 　文字を表示するタグを準備しましょう。 　初期表示として、初期値(0)を、　 「値：0」 　と表示しましょう。 　これとは別に、３つのボタンを用意しましょう。 　１つ目：「リセット」という文字のボタン。 　２つ目：「１を減算」という文字のボタン。 　３つ目：「１を加算」という文字のボタン。 　この３つのボタンを用意して、 　それぞれのボタンが押された時に、 　labelの文字を…

さらに表示 課題【練習問題（DOM操作/イベント操作）】ーNo.003

課題内容 ＜概要＞ 　文字を表示するタグ（labelタグ）を２つ準備しましょう。 　初期表示として、　 「直近１つ目：」「直近２つ目：」 　とそれぞれ表示しましょう。 　１つ目：「りんごに変更」という文字のボタン。 　２つ目：「バナナに変更」という文字のボタン。 　３つ目：「みかんに変更」という文字のボタン。 　この３つのボタンを用意して、 　それぞれのボタンが押された時に、 　labelの文字を…

さらに表示 課題【練習問題（DOM操作/イベント操作）】ーNo.002

課題内容 ＜概要＞ 　文字を表示するlabelタグを準備しましょう。 　初期表示として「初期のテキスト」と表示しましょう。 　そして、３つのボタンを用意します。 　１つ目：「りんごに変更」という文字のボタン。 　２つ目：「バナナに変更」という文字のボタン。 　３つ目：「みかんに変更」という文字のボタン。 　この３つのボタンを用意して、 　それぞれのボタンが押された時に、 　labelの文字を書き換…

さらに表示 課題【練習問題（DOM操作/イベント操作）】ーNo.001