jQuery脚本在HTML5 Boilerplate文件中的位置？

H5BP是否假设您将编写JavaScript和jQuery代码，以便它仅在窗口完全加载（使用onload监听器）时执行？我问的原因是H5BP在body标签的底部定位了jQuery包含脚本标签，如下所示。然而，除非我将jquery.min.js脚本元素移动到主体前面的head元素（并因此执行cookie脚本），否则设置cookie的脚本将不起作用。谢谢。jQuery脚本在HTML5 Boilerplate文件中的位置？

<!DOCTYPE html> 
    <head> 
     <meta charset="utf-8"> 
     <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
     <title></title> 
     <meta name="description" content=""> 
     <meta name="viewport" content="width=device-width"> 
     <script src="js/vendor/modernizr-2.6.2.min.js"></script> 
    </head> 
    <body> 
     <p>This is HTML5 Boilerplate.</p> 

     <!-- Cookie isn't set when jquery.min.js follows this element block --> 
     <script> 
      var test_profile = { browserWidth: $(window).width() }; 
      document.cookie = "test_profile=" + JSON.stringify(test_profile); 
     </script> 

     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
     <script>window.jQuery || document.write('<script src="js/vendor/jquery-1.9.1.min.js"><\/script>')</script> 
    </body> 
</html>

来源

2013-06-12 William

即第一<script>块取决于jQuery的（$(window).width()），所以jQuery的已被加载之前，不能使用。

只需推动该cookie脚本其他两个<script>块后：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.9.1.min.js"><\/script>')</script> 

<script> 
    var test_profile = { browserWidth: $(window).width() }; 
    document.cookie = "test_profile=" + JSON.stringify(test_profile); 
</script>

来源

2013-06-12 20:57:17 Blender

有道理。谢谢，B。 – William

jQuery脚本在HTML5 Boilerplate文件中的位置？

回答

相关问题