0

次のスクリプトがあるとしましょう

<script type="text/javascript">
  $(function($, d) { 
    var custom = {
      settings: { news: $('div.news') },
      init: function() { this.settings.news.html('new'); }
    }
  }(jQuery, $(document)))
</script>

オブジェクトにはより多くの機能があると想定できますが、私の質問はどこに配置すればよいですか? 私は2つのアプローチを知っています:

  1. スクリプトを<head>タグに配置します。そうすれば、オブジェクトが document.ready の後にのみ呼び出されるようにする必要があるため、jQuery オブジェクトの設定 ( $('div.news')) は空になりません。

  2. 私の意見では、2 番目の方法は意味的に正しくありませんが、document.ready 関数をあきらめることができます。スクリプトを html の後に「物理的に」配置するだけです。

どのようなソリューションを希望し、その理由は何ですか? よろしくお願いします！

4

2 に答える 2

3

ページのレイアウトのレンダリングに役立たないスクリプトは、できればスクリプト ファイル (スクリプト自体ではなく) への参照として、本文の下部に配置する必要があります。これにより、CSS + HTML でページを視覚的にレンダリングできるようになり、JavaScript (またはこの場合は jQuery) がレンダリングされた要素に適用されます。

ページ自体のパフォーマンスが向上するわけではありませんが、視覚的なレンダリングが高速化され、エンド ユーザーにより高速なエクスペリエンスが提供されるように見えます。

詳しくはこちらをご覧ください。

于 2013-01-29T15:06:59.830 に答える
0

終了bodyタグの直前にこのようなコードを配置し、init（）を実行します。

var custom: {
    settings: { news: null },
    init: function() {
        this.settings.news = $('#news');
        this.settings.news.html('new'); 
    }
}

custom.init();

そんな感じ。

アンソニーのコメントを反映するように編集されました。

于 2013-01-29T15:06:31.340 に答える