异步加载网页

时间:2012-04-22 10:37:24

标签: javascript jquery html5 asynchronous

我在HTML5中有一个WebApp。

以下是link

我想异步加载整个网页。就像访问网页时一样,我想向用户显示加载图像,并且页面在后台完全以异步模式加载。我试图加载脚本异步但它不会影响它的行为。

有没有办法可行!

3 个答案:

答案 0 :(得分:2)

渲染一个只有一个加载图像作为背景设置的空体...在头部你有一个脚本标签,可以在dom上进行ajax调用并加载所需的内容......

编辑:当然所需的内容应包含所需的所有其他标记和脚本标记...然后使用响应更新正文

document.body.innerHTML = request.responseText;

编辑2:我建议在本机javascript中编写该头文件,因为你只需要更少的< 1kb做一个干净的(甚至跨浏览器ajax工作)调用你的ajax响应中定义的url ...你可以确定没有任何东西会被覆盖或加载两次(除了你可能加载一个库的ajax功能)

答案 1 :(得分:1)

尝试使用与Tobias Krogh建议的方法相同的方法。

但不是通过使用普通的旧JS

将内容放在#main中
document.body.innerHTML = request.responseText;

使用Jquery使用.html()

将内容放入正文
$("body").html(request.responseText);

编辑: 加载CSS& JS使用JS加载器。 可能LazyloadYepNope,以异步方式加载它们。 那应该做的工作!

答案 2 :(得分:0)

你可以设法通过在你的css中设置某种覆盖加载器来实现这一点,这可以在你的页面完全加载后显示,然后在你的页面完全加载之后,用javascripting删除叠加(淡出)...... / p>

像这样http://jsfiddle.net/6Ldyd/

当然你应该在加载页面的最后一个元素之后制作某种回调函数来删除叠加层(或者在加载最后一个元素之后调用它的脚本)