ES2015_001
コメント
■JavaScriptのプログラム中にコメントを入れる。
インラインコメント
「//」で始まる文字列は、その行の終わりまでコメントとなる。
ブロックコメント
「/*」から「*/」の間はコメントとして扱われる。
コメント例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>コメントサンプル</title>
</head>
<body>
<script>
/* 変数a と 変数b の合計を計算し、
ダイアログボックスで表示する。 */
const a=2; // 値
const b=3; // 値
let total; // 合計
/* 合計を求める計 */
total= a+b;
/* ダイアログボックスを表示 */
alert(a + "+" + b + "= " + total);
</script>
</body>
</thml>
例では、HTMLファイルな中でタグ「<script> ~ </script>」の間に JavaScript を記述しています。
■HTMLの記述でコメントを入れる
「<!--」から「-->」の間はコメントとして扱われる。
コメント例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>コメントサンプル</title>
<!-- ここはコメントです。 -->
</head>
<body>
コメントサンプルの例です。
<!--
ここはコメントです。
-->
</body>
</thml>
■HTMLの記述でコメントを入れる
「/*」から「*/」の間はコメントとして扱われる。
コメント例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>コメントサンプル</title>
<style>
body { color: red; } /* 文字の色を赤にする。 *
/*
ここはコメントです。
複数行のコメントも記述できる。
*/
</style>
</head>
<body>
CSSのコメントサンプルの例です。
</body>
</thml>
例では、HTMLファイルな中でタグ「<style> ~ </style>」の間に CSS を記述しています。
■HTMLとCSSとJavaScriptを三つのファイルに分ける。
HTMLファイルにCSSとJavaScriptを含めた例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>サンプルプログラム</title>
<style>
body { color: red; } /* 文字の色を赤にする。 *
</style>
</head>
<body>
サンプルプログラムです。
<script>
/* 変数a と 変数b の合計を計算し、
ダイアログボックスで表示する。 */
const a=2; // 値
const b=3; // 値
let total; // 合計
/* 合計を求める計 */
total= a+b;
/* ダイアログボックスを表示 */
alert(a + "+" + b + "= " + total);
</script>
</body>
</thml>
上のプログラムを三つのファイルに分けます。
HTMLファイル
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>サンプルプログラム</title>
<!-- style の部分を外部ファイル(main.css)にして呼び込む -->
<link rel="stylesheet" href="main.css">
</head>
<body>
サンプルプログラムです。
<!-- script の部分を外部ファイル(main.js)にして呼び込む -->
<script src="main.js"></script>
<script>
</body>
</thml>
CSSファイル
body { color: red; } /* 文字の色を赤にする。 *
JavaScriptファイル
/* 変数a と 変数b の合計を計算し、
ダイアログボックスで表示する。 */
const a=2; // 値
const b=3; // 値
let total; // 合計
/* 合計を求める計 */
total= a+b;
/* ダイアログボックスを表示 */
alert(a + "+" + b + "= " + total);