練習問題(20110815版)解答例
================================================================================
■Q1. 身長(m)と体重(kg)を入力してBMIを求めて表示する。
BMIは次の式で求まる。
体重 / 身長^2
---
<html>
<head>
<title>JavaScript</title>
<style>
.question {background-color: #CCFFFF}
.answer {background-color: #CCFF99}
</style>
</head>
<body>
Q1. 身長(m)と体重(kg)を入力してBMIを求めて表示する。
BMIは次の式で求まる。
体重 / 身長2
<script type="text/javascript">
var height = Number(prompt("身長入力(m)", 0));
var weight = Number(prompt("体重入力(kg)", 0));
document.write(weight / (height * height) + "
");
</script>
</body>
</html>
---
■Q2. 2つの数値を入力する。
入力した2つの数値を、小さい順に並べて表示する。
---
<html>
<head>
<title>JavaScript</title>
<style>
.question {background-color: #CCFFFF}
.answer {background-color: #CCFF99}
</style>
</head>
<body>
Q2. 2つの数値を入力する。
入力した2つの数値を、小さい順に並べて表示する。
<script type="text/javascript">
var i1 = Number(prompt("1番目の数値を入力してください。", "0"));
var i2 = Number(prompt("2番目の数値を入力してください。", "0"));
document.write("入力した数値は " + i1 + ", " + i2);
document.write("
");
document.write("小さい順に並べると ... ");
if (i1
");
</script>
</body>
</html>
---
■Q3. 3つの数値を入力する。
入力した3つの数値の中の最小値を表示する。
---
<html>
<head>
<title>JavaScript</title>
<style>
.question {background-color: #CCFFFF}
.answer {background-color: #CCFF99}
</style>
</head>
<body>
Q3. 3つの数値を入力する。
入力した3つの数値の中の最小値を表示する。
<script type="text/javascript">
var i1 = Number(prompt("1番目の数値を入力してください。", "0"));
var i2 = Number(prompt("2番目の数値を入力してください。", "0"));
var i3 = Number(prompt("3番目の数値を入力してください。", "0"));
document.write("入力した数値は " + i1 + ", " + i2 + ", " + i3);
document.write("
");
document.write("最小値は ... ");
var min = i1;
if (min > i2) {
min = i2;
}
if (min > i3) {
min = i3;
}
document.write(min);
document.write("
");
</script>
</body>
</html>
---
■Q4. 数値を入力する。
入力した数値の符号を表示する。
表示は、「-」、「0」、「+」でかまわない。
---
<html>
<head>
<title>JavaScript</title>
<style>
.question {background-color: #CCFFFF}
.answer {background-color: #CCFF99}
</style>
</head>
<body>
Q4. 数値を入力する。
入力した数値の符号を表示する。
表示は、「-」、「0」、「+」でかまわない。
<script type="text/javascript">
var i1 = Number(prompt("数値を入力してください。", "0"));
document.write("入力した数値は " + i1);
document.write("
");
document.write("符号は ... ");
if (i1 < 0) {
document.write("「-」");
} else if (i1 == 0) {
document.write("「0」");
} else {
document.write("「+」");
}
document.write("<br/>");
</script>
</body>
</html>
---
■Q5. 数値を入力する。
入力した数値が、1～12の範囲に入っているかどうかを確認する。
表示は、「入っている」、「入っていない」でかまわない。
(ヒント) 範囲に入っていないものからチェックするとよい
---
<html>
<head>
<title>JavaScript</title>
<style>
.question {background-color: #CCFFFF}
.answer {background-color: #CCFF99}
</style>
</head>
<body>
Q5. 数値を入力する。
入力した数値が、1～12の範囲に入っているかどうかを確認する。
表示は、「入っている」、「入っていない」でかまわない。
(ヒント) 範囲に入っていないものからチェックするとよい
<script type="text/javascript">
var i1 = Number(prompt("数値を入力してください。", "0"));
document.write("入力した数値は " + i1);
document.write("
");
document.write("1～12の範囲に ... ");
if (i1 < 1) {
document.write("入っていない");
} else if (i1 > 12) {
document.write("入っていない");
} else {
document.write("入っている");
}
document.write("
");
</script>
</body>
</html>
---
■Q6. 3-for2.html で、年も選択できるようにする。
年の範囲は、1990年～2020年とする。
---
<html>
<head>
<title>JavaScript</title>
<style>
.question {background-color: #CCFFFF}
.answer {background-color: #CCFF99}
</style>
</head>
<body>
Q6. 3-for2.html で、年も選択できるようにする。
年の範囲は、1990年～2020年とする。
<form>
誕生日：
<select>
<script type="text/javascript">
for(var i = 1990; i <= 2020; i++){
document.write("<option>" + i + "</option>");
}
</script>
</select>
年
<select>
<script type="text/javascript">
for(var i = 1; i <= 12; i++){
document.write("<option>" + i + "</option>");
}
</script>
</select>
月
<select>
<script type="text/javascript">
for(var i = 1; i <= 31; i++){
document.write("<option>" + i + "</option>");
}
</script>
</select>
日
</form>
</script>
</body>
</html>
---
■Q7. 数値を入力する。
入力された数分、★を横に並べて表示する。
(ヒント) 1個の★を表示する文を繰り返す
---
<html>
<head>
<title>JavaScript</title>
<style>
.question {background-color: #CCFFFF}
.answer {background-color: #CCFF99}
</style>
</head>
<body>
Q7. 数値を入力する。
入力された数分、★を横に並べて表示する。
(ヒント) 1個の★を表示する文を繰り返す
<script type="text/javascript">
var i1 = Number(prompt("数値を入力してください。", "0"));
document.write("★を " + i1 + " 個並べる ...
");
for (var i = 1; i <= i1; i++) {
document.write("★");
}
</script>
</body>
</html>
---
■Q8. 1～100の間にある3の倍数を表示する。
(結果) 3 6 9 12 ... 99
(ヒント)
for文で、カウンターを更新する式を+3ずつにする
または
if文で、カウンターの値が3の倍数かどうかを判断して、3の倍数のときだけ表示する
なお、カウンターを3で割ったときの余りが0のとき、3の倍数である。
(応用)
3の倍数だけでなく、3のつく数字も表示する
---
<html>
<head>
<title>JavaScript</title>
<style>
.question {background-color: #CCFFFF}
.answer {background-color: #CCFF99}
</style>
</head>
<body>
Q8. 1～100の間にある3の倍数を表示する。
(結果) 3 6 9 12 ... 99
(ヒント)
for文で、カウンターを更新する式を+3ずつにする
または
if文で、カウンターの値が3の倍数かどうかを判断して、3の倍数のときだけ表示する
なお、カウンターを3で割ったときの余りが0のとき、3の倍数である。
(応用)
3の倍数だけでなく、3のつく数字も表示する
<script type="text/javascript">
for (var i = 3; i <= 100; i += 3) {
document.write(i);
document.write(" ");
}
</script>
別解
<script type="text/javascript">
for (var i = 1; i <= 100; i++) {
if ((i % 3) == 0) {
document.write(i);
document.write(" ");
}
}
</script>
応用
<script type="text/javascript">
for (var i = 1; i <= 100; i++) {
if ((i % 3) == 0) { // 3の倍数
document.write(i);
document.write(" ");
} else if ((i % 10) == 3) { // 1桁目が3
document.write(i);
document.write(" ");
} else if ((30 <= i) && (i <= 39)) { // 30台の数字
document.write(i);
document.write(" ");
}
}
</script>
</body>
</html>
---
■Q9. 「指定された数分、★を横に並べて表示する」関数 print_star(num) を作る。
この数は、promptを使って入力する。
(応用1)
この関数を利用して、★を正方形に並べる。
(結果例) 3つの場合
★★★
★★★
★★★
(応用2)
この関数を利用して、★を直角三角形に並べる。
(結果例) 3つの場合
★
★★
★★★
---
<html>
<head>
<title>JavaScript</title>
<style>
.question {background-color: #CCFFFF}
.answer {background-color: #CCFF99}
</style>
</head>
<script type="text/javascript">
function print_star(num) {
for (var i = 1; i <= num; i++) {
document.write("★");
}
}
</script>
<body>
Q9. 「指定された数分、★を横に並べて表示する」関数 print_star(num) を作る。
この数は、promptを使って入力する。
(応用1)
この関数を利用して、★を正方形に並べる。
(結果例) 3つの場合
★★★
★★★
★★★
(応用2)
この関数を利用して、★を直角三角形に並べる。
(結果例) 3つの場合
★
★★
★★★
<script type="text/javascript">
var i1 = Number(prompt("数値を入力してください。", "0"));
document.write("★を " + i1 + " 個並べる ...
");
print_star(i1);
</script>
(応用1)
<script type="text/javascript">
for (var i = 1; i
");
}
</script>
(応用2)
<script type="text/javascript">
for (var i = 1; i
");
}
</script>
</body>
</html>
---
※コメント投稿者のブログIDはブログ作成者のみに通知されます