1

我想从 Google CDN 使用 jQuery,并且我还想实施一个后备策略,以防 jQuery 无法从 Google 加载。当然,我知道一个很好的解决方案,它总是对我有用并且仍然有效:

<html>

<head>

  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js" type="text/javascript"></script>

  <!-- fallback: load local jq -->
  <script type="text/javascript">
    if (typeof jQuery == 'undefined'){
      document.write(unescape("%3Cscript src='/js/jquery/jquery-1.7.2.js' type='text/javascript'%3E%3C/script%3E"));
    }
  </script>

  <script type="text/javascript">
    alert(jQuery); // something != undefined => works as expected
  </script>

</head>

<body></body>

</html>

现在我想知道为什么这在这里不起作用:

<html>

<head>

  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js" type="text/javascript"></script>

  <!-- fallback: load local jq -->
  <script type="text/javascript">

    if (typeof jQuery == 'undefined'){ 

      var script  = document.createElement('script');
      script.type = 'text/javascript';
      script.src  = '/js/jquery/jquery-1.7.2.js';        

      //this seems not to work :-(
      document.getElementsByTagName('head')[0].appendChild(script);
    }
  </script>

  <script type="text/javascript">
    alert(jQuery); // undefined => but why????????
  </script>

</head>

<body></body>

</html>

我知道问题在于,如果我使用 document.createElement('script') 然后将刚刚创建的脚本元素添加到通过 DOM 操作(没有 document.write() ),新元素确实添加到了 DOM,但此时它还没有加载和执行。相反,它会在稍后的某个时间执行。但我真的希望头部中的任何脚本标签都被同步加载和执行。这似乎不适用于我上面描述的情况。

但另一方面,第一个例子工作得很好——所以 document.write() 似乎符合我的预期——但为什么呢?

4

0 回答 0