docへの書き込みを実行する。非同期にロードされた外部スクリプトから、明示的にドキュメントを開かないと書き込めない。

質問

ページロードが実行された後に、あるスクリプトをロードしようとしているのですが、以下のような感じです。

function downloadJSAtOnload(){
            var element = document.createElement("script");
            element.src = "scriptSrc";
            document.body.appendChild(element);
        }

         if (window.addEventListener)
                  window.addEventListener("load", downloadJSAtOnload, false);
            else if (window.attachEvent)
                  window.attachEvent("onload", downloadJSAtOnload);
            else window.onload = downloadJSAtOnload;

そして、このスクリプトは実行され、'scriptSrc'をダウンロードし、bodyタグの最後の直前に追加しているようですが、コンソール（chrome）には以下のメッセージ（エラーではありません）が出力されます。

Document'で'write'の実行に失敗しました。非同期にロードされた外部スクリプトから、明示的にオープンされない限り、ドキュメントに書き込むことはできません。

これは何を意味するのでしょうか。また、私は何か違うことをしなければならないのでしょうか？期待された動作が得られているにもかかわらず？

どのように解決するのですか？

非同期に読み込まれたスクリプトは、ドキュメントが完全に解析され、閉じられた後に実行される可能性が高いです。 したがって document.write() を使用することはできません (技術的には可能ですが、あなたが望むことはできないでしょう)。

を置き換える必要があります。 document.write() ステートメントを、DOM 要素を作成して特定の親要素に挿入することで、明示的な DOM 操作に置き換える必要があります。 .appendChild() または .insertBefore() または設定 .innerHTML のような直接の DOM 操作のための何らかのメカニズムが必要です。

例えば、インラインスクリプトでこのようなコードを書くのではなく

<div id="container">
<script>
document.write('<span style="color:red;">Hello</span>');
</script>
</div>

これを利用して、上記のインラインスクリプトを動的に読み込むスクリプトに置き換えることになります。

var container = document.getElementById("container");
var content = document.createElement("span");
content.style.color = "red";
content.innerHTML = "Hello";
container.appendChild(content);

あるいは、コンテナの中に、ただ単に追加する必要のある他のコンテンツがなければ、単にこうすることもできます。

var container = document.getElementById("container");
container.innerHTML = '<span style="color:red;">Hello</span>';