【Javascript】HTML内にスクリプトを挿入して実行

Javascript

2017.01.22

この記事では、Javascriptを用いて、HTMLページにスクリプト（Javascript）を入れて実行させる方法を紹介します。

## HTML中にスクリプト挿入・実行

Javascriptでは、DOM操作を用いることで、HTMLページ中のスクリプトを挿入して実行させることができます。
これを使うことで動的（ダイナミック）なページを作ることができます。
今回は、「document.createElement」と「appendChild」を用いて実装してみました。

【書式】
var pre = document.createElement(‘pre’);
pre.innerHTML = code;
document.getElementById(‘nicovideo’).appendChild(pre);

HTMLページの指定したIDを持つタグ内に、スクリプト(code)を挿入して実行

## ソースコード

サンプルプログラムのソースコードは下記の通りです。
【main.js】

【index.html】

## 実行結果

サンプルプログラムの実行結果は下記の通りです。
index.htmlを開くと「にゃんぱすー」と書かれたアラート画面が表示されます。
（bタグも挿入されている）

【おすすめ関連記事】
・Javascript入門基本文法