1

こんにちは、私は今のところGoogle ajax APIをいじっています。ドキュメントの例に従って、htmlファイルに2つのスクリプトタグがあります。

<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script language="Javascript" type="text/javascript">google.load('search', '1');</script>

すべて正常に動作しますが、jquery を使用して google.load('search', '1'); を呼び出そうとすると機能しません。$(document).ready(function() の後の外部 JavaScript ファイル

次のエラーが表示されます: null は null であるか、オブジェクトではありません。

私はJavaScriptを学んでいるので、明らかに基本的な何かが欠けていますが、JavaScriptを目立たないように使用するのが最善であるという印象を受けました。実際にいくつかの js コードを含む 2 番目のスクリプト タグは控えめではありません。誰でもこれで助けてもらえますか？

4

1 に答える 1

7

あなたが説明したことから、あなたのページは次のように設定されているようです：

<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">
    google.load('jquery');
    $(document).ready(function(){
       ... do stuff ...
    });
</script>
<script src="/my/external.js" type="text/javascript"></script>

ただし、DOM が完全に読み込まれるまでイベントが発生しないため、これは期待どおりには機能しません。document.readyただし、JavaScript ファイルはロード時に実行されます。したがって、実際の実行は次のようになります。

  1. Google JSAPI を読み込む
  2. jQuery を読み込む
  3. External.js を読み込む
  4. ドキュメントの準備完了を呼び出す

コードの残りの部分がどのように見えるかによって、すべての初期化コードを別のファイルに入れるか、searchロードをメイン ドキュメントに戻すことができます。

目立たないコードについて:

デイビッド、目立たない JavaScript は、それがページ内か外部かではなく、ページにどのように影響するかに関係しています。

それよりも、サイトを JavaScript に依存しすぎて、無効にすると機能しないようにしないことが重要です。

たとえば、これは目障りです。

<a href="#" onclick="doSomething(); return false;">Click Me</a>

JavaScriptが有効になっている場合にのみ機能するためです。さらに、コードはインラインであり、機能が構造 (HTML) から分離されていないため、不適切です。

ただし、同様のコードを使用すると、次のようになります。

<a href="/do/something" id="do-something">Click Me</a>

そして、このjavascript/jqueryスニペットを使用します:

$(document).ready(function(){
    $("#do-something").click(function(e){
       doSomethingNicer();
       e.preventDefault(); // Keep the browser from following the href
    });
});

ページは引き続き機能する (デフォルトで /do/something をロードする) ため目立たなくなりますが、JavaScript が有効になっているとより適切に機能します (その URL をロードする代わりに JavaScript を実行します)。これはプログレッシブ エンハンスメントとも呼ばれます。

于 2009-12-27T21:43:05.990 に答える