###前提・実現したいこと
たとえば,
html
1<head> 2<script src="main.js"></script> 3</head> 4<body></body>
となっていて,この中のscriptタグの参照先をmain.jsからindex.jsに変更するのはどうすれば良いでしょうか......?
下記コードにありますが,これをiframe内で行いたい,といった質問です
###発生している問題・エラーメッセージ
jsは動的な書き換えはできず,一応document.getElementsByTagName("script")[0].src="index.js";で見かけの上では変更することはできますが,実際に中身が変わったわけではありません
また,今回目標としているのは"書き換え"であって"実行"ではないので,createElementなどで新たに作ることも目的ではありません
ただし,問題となるのはmain.jsが実行されてしまうという点ですので,例えばmain.jsが実行する前にremoveChildなどで消し,新たにcreateElementで上書きするというのはアリです
###該当のソースコード
javascript
1let iframe=document.createElement("iframe"); 2iframe.addEventListener("load",function(){ 3let html='<head><script src="main.js"></script></head>'; 4iframe.contentDocument.open(); 5iframe.contentDocument.write(html); 6iframe.contentDocument.close(); 7let script=iframe.contentDocument.getElementsByTagName("script")[0]; 8script.src="index.js"; 9});
###試したこと
一回読み込んでscriptタグの参照先を変更し,その際のhtml文書を変数に格納しておき,iframeを更新して再度読み込んだ後にその文書をdocument.writeで実行させる.と言ったことをやって見ました
見事変更したhtmlは実行されますが,その前に一回読み込んだことによって一度main.jsがやはり実行されてしまうというのが難点です
###追記
一応作成したい目標というのはブラウザ上で動作するhtmlやjavascriptのテキストエディタです
タブごとにhtmlやjavascriptを記述できて,最終的にhtmlはiframeで動作が確認できるようにしたいです
なので,html用のタブに書いたコードをdocument.writeでiframeに書き込み,javascript用のタブに書いたコードはfileReaderAPIでURL化した後に,記述したhtml内のscriptタグのsrc属性先に指定する,と言った流れを想像しています
最終的にコードはダウンロードできるようにしたいので,できるだけ普通のエディタで書く記述と同じように記述はできるようにしたいです
回答3件
あなたの回答
tips
プレビュー