JavaScriptはCUIでも実行できますが、GUIで使うケースの方が多いので、GUIでHelloWorldを書いてみました。
JavaScriptのHelloWorldはログに出力したりポップアップ表示したりするものが多いですが、ブラウザ上に出力した方がJavaScriptっぽい気がするので、ブラウザ上に表示するサンプルを提示します。
【サンプルコード１】
・Sample.html
<!DOCTYPE html>
<html lang="ja">
<head>
<!-- charsetがutf-8なので、このファイルもutf-8で保存する必要がある -->
<meta charset="utf-8">
<title>Sample</title>
</head>
<body>
<script>
// window.onloadでロード時に実行される
window.onload = function(){
// documentはブラウザに読み込まれたウェブページを表す
// getElementByIdでHTML上で使うidを参照する
// innerHTMLではHTML要素の内容を書き変える
document.getElementById("sample").innerHTML
= "Hello World!<br>↑JavaScriptによる出力";
}
</script>
<p id="sample"></p>
</body>
</html>
【結果１】
・Sample.htmlをChromeで開いた結果
---------------------------
サンプルコード１のようにJavaScriptはHTML内に書くことができますが、サンプルコード２のようにJavaScriptを別ファイルにするケースの方が多いと思いますので、別ファイルにするサンプルも提示します。
【サンプルコード２】
・Sample.html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>Sample</title>
</head>
<body>
<!-- src属性で外部のスクリプトを指定できる -->
<script src="Sample.js"></script>
<p id="sample"></p>
</body>
</html>
・Sample.js
window.onload = function(){
document.getElementById("sample").innerHTML
= "Hello World!<br>↑JavaScriptによる出力";
}
【結果２】
結果１と同じため割愛
