5

javascriptを使用してスクリプトを動的に挿入するために出くわしたほぼすべての例で、次のように終わります。

document.getElementsByTagName("head")[0].appendChild(theNewScriptTag)

yepnope.jsでさえ、ページの最初のスクリプトの前に次のような新しいスクリプトを添付します。

var firstScript = doc.getElementsByTagName( "script" )[ 0 ];
firstScript.parentNode.insertBefore( theNewScriptTag, firstScript );

私の質問は、それをドキュメントの本文に追加しないのはなぜですか？

document.body.appendChild(theNewScriptTag);

私には、DOMトラバーサルgetElementsByTagName（または「insertAfter = parent.insertBefore」トリック全体）がリソースを浪費しているように見えます。

スクリプトを一番下に動的に追加することに不利益はありますか？

4

3 に答える 3

17

真剣に、私が検索したときになぜこれが表示されなかったのですか？ スクリプトを添付するdocument.head、document.body

コメントは完璧な説明へのリンクです：スクリプト要素を追加するというばかげたケース。

基本的に、いくつかのオプションがあります。

  • 頭にフック

    document.getElementsByTagName('head')[0].appendChild(js)
    1. プロ-ほとんどのページに頭があります
    2. 短所-そうでない場合、常に自動生成されるとは限りません。トラバーサル

  • 体に引っ掛ける

    document.body.appendChild(js);
    1. プロ-最短、トラバーサルなし
    2. Con-の直接の子から実行されていない場合、IE7で「操作が中止されました」エラーbody

  • フックするdocumentElement

    var html = document.documentElement;
html.insertBefore(js, html.firstChild);
    1. Pro-常に存在し、最小限のトラバーサル
    2. 詐欺-またはそれをしますか？（最初の子がコメントの場合は失敗します）

  • 最初のスクリプトにフックする

    var first = document.getElementsByTagName('script')[0];
first.parentNode.insertBefore(js, first);
    1. Pro-ほとんどの場合、スクリプトから動的ロードを呼び出します
    2. Con-以前のスクリプトが存在しない場合は失敗します。トラバーサル

だから、結論は-あなたはそれをどのようにでも行うことができますが、あなたはあなたの聴衆について考える必要があります。ローダーが実行される場所を制御できる場合は、を使用できますdocument.body。ローダーが他の人が使用するライブラリの一部である場合は、使用した方法に応じて具体的な指示を与え、仕様を悪用する人に備える必要があります。

于 2012-08-24T16:56:45.607 に答える
0

document.write(...)これは、存在する要素や他のスクリプトによって操作される要素に依存することなく、いつでも使用できると思います。

何かのようなもの：

document.write(unescape("%3Cscript src='my_file.js' type='text/javascript'%3E%3C/script%3E'"));
于 2016-02-24T09:26:11.240 に答える
-1

ページの下部にスクリプトを追加できます。

insertBeforeを使用してヘッドに追加する利点は、非同期でロードすることです。はい、新しいブラウザは非同期属性をサポートするようになりましたが、古いブラウザ（IE8以下）で動作するには、属性をヘッドに追加することが非同期でロードする唯一の方法です。

詳細

于 2012-08-24T16:43:05.620 に答える