html5boiler plate + jquery mobile =脚本加载两次 [英] html5boiler plate + jquery mobile = scripts loading twice

问题描述

我正在使用 html5样板作为html等基础的实验性jquery基于移动设备的应用程序。

I am working on an experimental jquery mobile based app using html5 boilerplate as a base for html and such.

基本上我到目前为止所做的就是：

Basically all I have done thus far is:

1. 下载并解压缩html5样板，并在浏览器中查看它。确保脚本/样式正确加载。好的准备好了。


2. 添加jquery mobile（cdn托管完整版1.0 [今天发布？正确！]）


3. 添加 $（document）.ready（function（）{console.log（'ready'）;}）;


4. 重新加载。 'ready'输出两次..第二个输出稍微延迟..


5. wtf bbq和chrome检查器中的检查情况..请注意所有javascript文件似乎都加载了两次。 / li>
   
6. 从头开始重新启动，在浏览器中提取h5bp加载，特别注意脚本加载一次。添加文档就绪处理程序，观察一个'ready'输出。


7. 添加jquery mobile observe脚本加载一次。


8. 将所有脚本移动到标记中。脚本加载一次。

1. Download and extract html5 boilerplate, and view it in the browser. Make sure scripts/styles are loading properly. Good ready to go.
2. Add jquery mobile (cdn hosted full version 1.0 [released today? right on!])
3. Add $(document).ready(function () { console.log('ready'); });
4. Reload. 'ready' is output twice.. the second one after a slight delay..
5. wtf bbq and such inspect situation in chrome inspector.. notice all javascript files seem to be loading twice.
6. Restart from scratch, extract h5bp load in browser, note in particular that scripts load once. Add document ready handler, observe one output of 'ready'.
7. Add jquery mobile observe scripts loading once.
8. Move all scripts into the tag. Scripts load once.

任何人都知道发生了什么？重现这一点应该很容易，只需提取h5bp并将jquery mobile添加到底部的脚本部分，然后突然脚本全部加载两次。将所有这些脚本移动到现代化之下（或之前）的头标记中，这不再发生。

Anyone have any idea what is going on? It should be pretty easy to reproduce this, just extract h5bp and add jquery mobile to the scripts section at the bottom and suddenly the scripts all are loading twice. Move all those scripts into the head tag beneath (or before) modernizr and this no longer occurs.

谢谢

推荐答案

Modernizr使用YepNope加载脚本。如果您在这里查看问题： https://github.com/SlexAxton/yepnope .js / issues / 10

Modernizr uses YepNope to load scripts. If you take a look at the issue here: https://github.com/SlexAxton/yepnope.js/issues/10

你会看到脚本被故意加载两次：

you'll see that scripts are intentionally loaded twice:

Yepnope确实要求你输入的每个文件两次。第一次
它将自己加载到你的缓存中作为某种非可执行实体
（一个对象元素，或一个img元素，或一个带有假
类型属性的脚本元素，具体取决于在你的浏览器上）。第二次注入
时，我们将其作为可执行脚本注入，这次是缓存
。所以实际上只需要毫秒或更少的时间来执行回调函数并重新注入一个额外的脚本标记需要
（并且无论多长时间来访问缓存都需要
）。

Yepnope does request every file you put into it twice. The first time it loads itself into your cache as some sort of non-executable entity (an object element, or an img element, or a script element with a fake type attribute, depending on your browser). The second time it's injected, we inject it as an executable script, and this time it's cached. So there is really only the millisecond or less that it takes to execute the callback function and reinject a script tag extra (and however long it takes to access the cache).

在 http://yepnopejs.com <上也提到了这一点/ a>主页。只需去那里向下滚动到我在开发工具中看到两个请求，为什么要加载所有内容两次？

这篇关于html5boiler plate + jquery mobile =脚本加载两次的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！