2014-11-12

2014-11-12

作ってみよう★★★★Add Star

 

 

必ず作ってみること!

<!DOCTYPE html>
<html ja>
<head>
<metacharset="UTF-8">
<title>JavaScriptの演習</title>
</head>
<body>
<script>

</script>
</body>
</html>


ダイアログボックスに入力された数値の値が、偶数か奇数かを判別してブラウザに表示する



現在の時刻を表示する



「今年は、~~年です。」と表示する



「今日は、~月~日です。」と表示する



「今は、~時~分です。」と表示する


平日には「営業中」、土曜日・日曜日には「定休日」と表示する
  • if文の場合
  • switch文の場合



入力された点数の数値を「100が満点」「80点以上が合格」「80点未満が不合格」と表示する



月の数値を入力すると「春です」「夏です」「秋です」「冬です」と表示する
  • if文の場合
  • switch文の場合



JavaScriptの勉強」という文字を5回繰り返し表示する
  • while文の場合
  • for文の場合



和暦(平成)と西暦を並べて表示する
  • while文の場合
  • for文の場合



1~100までの合計をダイアログボックスに表示する



1~100までの数字の内、2の倍数を合計して結果を、ボタンを押したらブラウザに表示する


入力された数字までの合計をダイアログボックスに表示する
  • while文の場合
  • for文の場合



以下のような九九の表を表示する

 

f:id:web-javascript:20120612121907j:image

 


<table>
<tr>
<th></th><th>1</th><th>2</th><th>3</th><th>4</th><th>5</th><th>6</th><th>7</th><th>8</th><th>9</th>
</tr>
<script>
for(var i = 1; i <= 9; i++){
document.write ('<tr>');	
document.write('<th>' + i +'</th>');
for(var j = 1; j <= 9; j++){
document.write('<td>'  + i*j + '</td>');	
}
document.write('</tr>');
}
</script>
</table>


サイコロの目を奇数のみ表示する

 

f:id:web-0127:20140408114247j:image f:id:web-0127:20140408114246j:image f:id:web-0127:20140408114245j:image f:id:web-0127:20140408114244j:image f:id:web-0127:20140408114243j:image f:id:web-0127:20140408114242j:image

 


<!DOCTYPE html>
<htmllang="ja">
<head>
<metacharset="utf-8">
<title>さいころの目:奇数のみ表示</title>
</head>
<body>
<script>
for(var i=1; i<=6; i++ ){
if( i%2 === 1){
document.write('<img src="img/d' + i + '.jpg">');
}
}
</script>
</body>
</html>


imgフォルダー内にある画像(6枚)をすべて表示する
  • 画像名が数字の場合
  • 画像名が固有の場合



「みかん」「りんご」「いちご」「もも」「なし」「かき」をリストで表示する



表示している画像をクリックしたら「ようこそ!」とダイアログボックスに表示する



ボタンが押される度に画像が変更され続けて表示する



ボタンが押される度にサイコロの目がランダムに表示する



再表示する度に画像がランダムに表示する



再表示する度に見出しの文字がランダムに表示する



3秒ごとに画像が自動更新して表示する



サムネールをクリックするとメイン画像が更新して表示する