/* Google Analytics ▽ */ /* Google Analytics △ */

WEB制作の勉強メモ / 猫脳人間

HTML CSS JavaScript ActionScript jQuery WordPress PHP Illustrator Photoshop Flash … 猫サイズの脳でも覚えるぞ と…

2015年 05月08日(36日目)のWEB制作の勉強メモ JavaScriptのテスト

JavaScript のテスト

【問01】JavaScript の標準化されたものをなんと言うか?

ECMAScript


【問2】js フォルダー内にある sample.js を読み込む記述をしなさい
<script type="text/JavaScript" src="js/sample.js"></script>





【問03】警告ウィンドウを表示するスクリプトを記述しなさい(値は不要)
alert('警告');




【問04】ブラウザに文字列を表示するスクリプトを記述しなさい(値は不要)
document.write('文字列');




【問05】マウスでクリックするときのイベントハンドラを記述しなさい
onClick
<p>例: <button onClick="">ボタンを押す</button></p>





【問06】配列 fruits の要素をコンソール内に順次一覧表示するスクリプトを記述しなさい。
(りんご、みかん、もも、すいか、バナナ)
// 例1:
var fruits = ['リンゴ','みかん','もも','すいか','バナナ'];
console.log(fruits[0]);
console.log(fruits[1]);
console.log(fruits[2]);
console.log(fruits[3]);
console.log(fruits[4]);
// 例2:
var fruits = ['リンゴ','みかん','もも','すいか','バナナ'];
  for(var i=0; i<fruits.length; i++) {
 console.log(fruits[i]);
}
// 例3:
var fruits = new Array(5);
fruits[0] = 'リンゴ';
fruits[1] = 'みかん';
fruits[2] = 'もも';
fruits[3] = 'すいか';
fruits[4] = 'バナナ';
for (var i = 0; i < fruits.length; i++) {
   console.log(fruits[i]);
}
// 例4:
var fruits = new Array('リンゴ','みかん','もも','すいか','バナナ');
for (var i = 0; i < fruits.length; i++) {
   console.log(fruits[i]);
}




【問07】今日の日付を、20XX年X月X日と表示させる記述をしなさい
var today = new Date();
var d = '今日は' + today.getFullYear() + '年' + (today.getMonth()+1) + '月' + today.getDate() +'日です';
document.write(d);





【問08】1~10 までの数値を加算した合計をブラウザに表示するスクリプトを記述をしなさい。
(マウスイベント不要)
var ans = 0;
for (var i=1; i<=10; i++) {
  ans = ans + i
}
document.write(ans);
var ans = 0;
for (var i=1; i<=10; i++) {
  ans += i
}
document.write(ans);






【問09】「ダイアログボックスの入力ウィンドウに入力された文字が
「奇数」か「偶数」かを判別する記述をしなさい
var num = prompt('半角数字で','例:57');
num = parseInt(num);
  if (num % 2 === 0) {
    document.write('偶数です');
    } else {
    document.write('奇数です');
  }
var num = prompt('半角数字で','例:57');
num = parseInt(num);
  if (num % 2 === 0) {
    document.write('偶数です');
    } else if (num % 2 === 1) {
    document.write('奇数です');
  } else {
    document.write('ERROR (半角の数字ではないようです)');
  }




【問10】img フォルダー内にある写真「d1.jpg~d6.jpg」を表示させるよう記述しなさい。
(ヒント:for 文で記述する)
var i=0;
for(i=1; i<=6; i++){
  document.write('<img src="img/d' + i + '.jpg" alt="画像">');
}
for(var i=1; i<=6; i++){
  document.write('<img src="img/d' + i + '.jpg" alt="画像">');
}



以下をテキストエディタにコピー&ペーストして繰り返しやってみる。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>2015年05月08日 JavaScript Test</title>
<style>
h2 {
  font-size: 18px;
  line-height: 24px;
  margin: 50px 50px 0;
}
p {
  margin: 20px 100px;
}
#container {
  width: 700px;
  margin: 20px auto;
}
#header, #footer {
  height: 40px;
  text-align: center;
  line-height: 40px;
  background: #333;
  color: #CCC;
}
</style>
</head>
<body>
<div id="container">

<div id="header">
<h1>2015年05月08日 JavaScript Test</h1>
</div><!-- /#header -->


<h2>【問01】JavaScript の標準化されたものをなんと言うか?</h2>

<P>【A】: </P>


<h2>【問02】js フォルダー内にある sample.js を読み込む記述をしなさい</h2>
<P>【A】: </P>

<!--
「js」フォルダを作り、その中に 
document.write('正しく sample.js が読み込まれました');
の一行だけを記述した「sample.js」を置いて
この問に正しく答えられていると、ブラウザで読み込んだ時に
「正しく sample.js が読み込まれました」と表示されます
-->

<h2>【問03】警告ウィンドウを表示するスクリプトを記述しなさい(値は不要)</h2>
<P>【A】: 
<script>

</script>
</P>


<h2>【問04】ブラウザに文字列を表示するスクリプトを記述しなさい(値は不要)</h2>
<P>【A】: 
<script>

</script>
</P>


<h2>【問05】マウスでクリックするときのイベントハンドラを記述しなさい</h2>
<P>【A】: </P>
<p>例: </p>


<h2>【問06】配列 fruits の要素をコンソール内に
    順次一覧表示するスクリプトを記述しなさい。</h2>
<p>(りんご、みかん、もも、すいか、バナナ)</p>
<P>【A】: (コンソールに出力)
<script>


</script>
</P>


<h2>【問07】今日の日付を、20XX年X月X日と表示させる記述をしなさい</h2>
<P>【A】:
<script>

</script>
</P>

<h2>【問08】1~10 までの数値を加算した合計を
    ブラウザに表示するスクリプトを記述をしなさい。</h2>
<p>(マウスイベント不要)</p>
<P>【A】:
<script>

</script>
</P>


<h2>【問09】「ダイアログボックスの入力ウィンドウに入力された文字が
「奇数」か「偶数」かを判別する記述をしなさい</h2>
<P>【A】:
<script>

</script>
</P>

<h2>【問10】img フォルダー内にある写真「d1.jpg~d6.jpg」を
    表示させるよう記述しなさい。</h2>
<p>(ヒント:for 文で記述する)</p>
<P>【A】: 
<script>

</script>
</P>


<div id="footer">
<p><small>2015年05月08日 JavaScript Test</small></p>
</div><!-- /#footer -->
</div><!-- /#container -->
</body>
</html>




SEO

  • <meta keywords=""> は書かない。
  • <meta discription="">
    に キーワードから始まる文言を3文節で書き、
    3文節それぞれに キーワードを一つずつ入れる。
  • 1文節それぞれが長すぎないように。
  • 正しいコーディング。
  • <body> 直後の <h1> <p> は特に重要。
    内容の無い文言にならないようにする。
  • Google Webmaster Tool
  • Yahoo! Bookmark + Yahoo Pipes
  • ブログなどからリンクし、紹介文を書く。