JavaScriptでJavaScriptを追加したいです。

解決済

質問者：noname#20964
質問日時：2006/07/07 14:20
回答数：4件

ホームページを一旦表示した後に、scriptタグを追加してその中にJavaScriptを追加する方法を教えてください。
h1タグを追加してそこにテキストノードを追加する感覚でできるものなのでしょうか。
やり方を教えてください。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (4件)

ベストアンサー優先
最新から表示
回答順に表示

No.4ベストアンサー

回答者： BLUEPIXY
回答日時：2006/07/08 12:45

＃３＞にはテキストエリアとボタンがあってそこにスクリプトを貼りつけてボタンを押せば作成中のページにそのスクリプトが挿入できれば便利だと単純に思っただけです。

テキストエリアにスクリプトを書いて実行するというサンプルを作ってみました。
ただ、言えるのは、document.write など読込時に実行されることで、HTMLを構成するような命令は、ページが表示されてからでは実行するのが遅すぎるために、別に書き換える必要があるし、HTMLの構成に依存するようなスクリプトはそれなりに書き換えないといけないです。
（つまり何でもかんでも、持ってきたスクリプトが直ちに実行できるわけではないということ）
サンプルは、テキストエリアに入力されたスクリプトを実行するもので、サンプルでテキストエリアに入力されているスクリプトは、テキストエリアとボタンを作成し、テキストエリアに入力されている文字をＵＲＬエンコードするものです。
IE6,Firefox1.5 で動作確認してあります。
----------------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>動的スクリプトの実行</title>
<script type="text/javascript">
</script>
</head>
<body>
実行したいスクリプト<br>
<textarea id="source" cols="80" rows="25">
alert("test");//←元々試したかったヤツ？

var ta = document.createElement('textarea');
ta.setAttribute("cols",72);
ta.setAttribute("rows",4);
ta.id="temp200607081300";
document.body.appendChild(ta);
ta.value="文字列をURL ENCODE変換";
var bt = document.createElement('button');
bt.setAttribute("type","button");
var btMsg = document.createTextNode('変換');
bt.appendChild(btMsg);
bt.onclick=function(){
conv("temp200607081300");
}
document.body.appendChild(bt);

function conv(id){
var el=document.getElementById(id);
el.value = encodeURI(el.value);
}

</textarea><br>
<button type="button" onclick="exec()">実行</button>
<hr>
</body>
</html>

- 0
- 件

通報する

この回答へのお礼

スクリプトまで作って頂きありがとうございます。
おかげさまで目的は達成できそうです。
結局SCRIPT内にjavascriptはそのまま挿入することはできないってことですね。

通報する

お礼日時：2006/07/08 22:14

No.3

回答者： BLUEPIXY
回答日時：2006/07/08 02:49

#2>SCRIPTの変わりに別のタグにすると同じスクリプトでも正常に動くんです。

同じようなテストをしてみましたが、ＩＥの場合、動的にスクリプトエレメント（<script></script>）にテキストの追加は、できないようです。（Firefox1.5 ではできました）

でも、＃２でも書いたようにeval を使って新しい関数とか（変数も）作成できるので、このようなこと(documentに動的にscriptエレメントを作成すること)に意味があるのかどうかは疑問です。
単なる知的好奇心からそういうテストをされているんでしょうか？
それとも、何か目的があるのでしょうか？

この回答への補足

たびたびありがとうございます。
ホームページを作っていてJavaScriptのサンプルを利用させてもらうことがあるんですが、実際に使って見るときに作成中のページをフレームで表示しておいて別のフレームにはテキストエリアとボタンがあってそこにスクリプトを貼りつけてボタンを押せば作成中のページにそのスクリプトが挿入できれば便利だと単純に思っただけです。
もともとはそんな形で画像などの素材を挿入して試していたのですが、JavaScriptでも使えるのかもと思ったのが切欠でハマってしまったのですが、今はできないことが納得できないと言うのが正直なところです。

補足日時：2006/07/08 09:54

通報する

- 0
- 件

通報する

No.2

回答者： BLUEPIXY
回答日時：2006/07/07 19:24

動的に関数を作成したいとかそういうことなら、

文字列として、関数を構成して
eval すればいいです。
（script タグを追加する必要はない）

この回答への補足

SCRIPT = document.getElementsByTagName('script')[0];
var javascript = "alert(\'alertを挿入\')\;";
var JS = document.createTextNode(javascript);
SCRIPT.appendChild(JS);
単純にこんなことができるのかと思っていたのですがcreateTextNodeでエラーが出てしまうんです。
createCommentかなと思ってやってみたんですがこれも使えないみたいなんです。（IEのみ確認）
そこで行き詰まってしまって質問させて頂きました。
何か間違っていますか？
単純な間違いのような気がするんですが、実際のものではSCRIPTも挿入するようになっていてSCRIPTの変わりに別のタグにすると同じスクリプトでも正常に動くんです。
そこで全く原因がわからなくなってしまいました。
なにかお気づきの点がありましたらまたお願いできますでしょうか。
よろしくお願いします。

補足日時：2006/07/07 23:37

通報する