JavaScript02 課題02回答

課題02の回答例と解説です。

Q.01

選択した点数に応じて表示する合格/不合格を判定してください。(60点以上で合格)

回答例

JavaScript

実行結果

Q.02

JavaScriptを使って300円以上のアイスの価格部分を赤色にしてください。

回答例

価格が表示されているspanタグをeach関数で順次参照して、300円より大きいかどうかをif文で判定、大きければCSSで赤色に変更、という処理を行います。

JavaScript

実行結果

  • アイスボックス:

    130円(税別)
  • 爽(バニラ):

    170円(税別)
  • チョコモナカジャンボ:

    170円(税別)
  • 牧場しぼり(ミルク):

    170円(税別)
  • PARM(チョコレート):

    170円(税別)
  • ハーゲンダッツ ミニカップ(バニラ):

    325円(税別)

Q.03

JavaScriptを使って画像の下に【ピカチュウ】の名前を追加してください。

回答例

JavaScript

画像のalt属性に名前が書かれていることを利用して、その値を取得してテキストとして表示します。
テキストの表示にはpタグを新規作成して画像に下に表示します。

実行結果

ピカチュウ

Q.04

JavaScriptを使って画像1.png〜10.pngの画像をまとめて表示してください。

回答例

画像名が数字になっていることを利用して、for文で1〜10までループさせてimgタグのsrc属性を作り表示させます。

JavaScript

実行結果