JavaScriptをWebページに組み込むには次の方法があります。
・HTML文書内に記述する方法
・外部ファイルに記述して読み込む方法
・HTML要素内に直接記述する方法
今回は、「HTML要素内に直接記述する方法」について、記載します。
スポンサーリンク
JavaScriptをHTML要素内に直接記述する方法
HTMLのa要素のhref属性など、HTMLの要素の属性（イベント属性）にjavascript:～という形でスクリプトを記述し、実行する方法です。
例えば、打ち合わせ時のイメージ共有に使う為に画面のレイアウトだけ作る場合など、ボタンやリンクに対する処理が未実装の場合に、よくこの方法が用いられます。
その際には「何もしない」もしくは「未実装の旨をメッセージで出す」のどちらかの対応をよく目にするので、この2つについて、下記に記載しておきます。
次の例ではクリックしても何も動作しないようになります。voidは何も値を返さない命令です。
スポンサーリンク
<html>
<head>
<title>JavaScript Sample</title>
</head>
<body>
<a href=”javascript:void(0)”>クリックしても何も起こりません。</a>
</body>
</html>
<head>
<title>JavaScript Sample</title>
</head>
<body>
<a href=”javascript:void(0)”>クリックしても何も起こりません。</a>
</body>
</html>
次の例ではクリックすると「未実装」のメッセージが表示されます。
<html>
<head>
<title>JavaScript Sample</title>
</head>
<body>
<input type=”button” value=”実行” onclick=”javascript:alert(‘未実装’);”>
</body>
</html>
<head>
<title>JavaScript Sample</title>
</head>
<body>
<input type=”button” value=”実行” onclick=”javascript:alert(‘未実装’);”>
</body>
</html>
スポンサーリンク
