2

JavaScript/jquery をページの下部に配置することをお勧めします。

しかし、この「ベストプラクティス」をどのように達成できますか?

現在の Web プロジェクト (MVC4) では、javascript を一番下に配置しました。しかし、JavaScript をヘッダーに配置しない限り、何も機能しません (これは悪い習慣と見なされますか?)。

<body>
<div id="container">
  <div id="header">
  </div>

  <div id="content">
    <!--js function that calls upon jQuery (slider) -->
  </div>
</div>

  <!--Javascript declaration-->
</body>

例えば：

 <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
 <script type="text/javascript" src="js/slider.js"></script>

関数 Slider.js には、スライダーを機能させるために jQuery が必要です。

すべての JavaScript ファイル (jQuery を含む) を下部に保持し、関数がアクセスする必要がある場合に jQuery (または他の関数/ライブラリ) をロードする方法はありますか?

アップデート

問題は MVCバンドルにあるようです。一番下の通常の構文でjavascriptファイルを配置すると、すべてが機能します。

別のバンドルが必要ですか? MVC がバンドルをロードする順序が不明です。

この種のバンドル (最初に jquery に続いて js 関数) を適用すると、実行順序が正しくありません。

このため、バンドルの利点を実際に見ることができません。誰か説明してくれませんか?

 bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                        "~/Scripts/jquery-1.7.1.js",                    
                        "~/Scripts/js/slider.js"));

ありがとう。

4

2 に答える 2

0

これが良い理由は、ブラウザーが Web ページと同期してスクリプトをロードするからです。そのため、それらを上部に配置すると、大きなスクリプトをロードするとコンテンツのロードが停止します。body タグを閉じる前の一番下に配置すると、コンテンツが最初に読み込まれるため、スクリプトの停止なしでページのポップアップがはるかに高速になります。

問題を解決するには、実行中のすべてのコードを document.ready または同等の jquery でラップします。

$(function(){
//your code here
})

jQuery がまだロードされていない場合は、console.log で確認できます。

if(!window.jQuery)
{
console.log("problem");
}

ここでは多くの情報を提供していないため、デバッグが困難です。私にできることは、それを行うための手順を提供することだけです。ページで他のスクリプトが実行される前に、jQuery がロードされていることを確認する必要があります。

ページにインライン スクリプト タグがありますか?

于 2013-01-28T22:05:56.297 に答える
-1

jQueryインポートがスクリプトの前にある限り、それらを一番下に置くことができるはずです。これらのスクリプトのいずれかに依存するページに他の JavaScript がありますか?

于 2013-01-28T22:07:15.137 に答える