java - google.load 问题

Question

您好，我现在正在使用 google ajax api，并按照文档中的示例进行操作，我的 html 文件中有两个脚本标记:

<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 代码的第二个脚本标签并不引人注目。任何人都可以为此提供帮助吗？

Answer 1

根据您的解释，您的页面似乎是这样设置的:

<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. 加载谷歌 JSAPI
2. 加载 jQuery
3. 加载External.js
4. 调用文档准备就绪

根据其余代码的外观，您可能希望将所有初始化代码放在单独的文件中，或者将 search 加载移回主文档。

关于不显眼的代码:

David，不显眼的 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 时它以更好的方式工作(执行 javascript 而不是加载该 url)。这也称为渐进增强。