加载外部内容的最佳方式

我目前正在处理单页大小。一切进展顺利，加载速度仍然足够快。仍然我想阻止我的网站加载缓慢。所以我正在考虑以下内容加载外部内容的最佳方式

我有一个包含瓷砖的投资组合页面。当你点击一个黑色的不透明覆盖图时，会弹出一个滑块。

目前我使用这种方法：

<div class="item" id="2"><img src="picture of project"/> 
    <div class="hoverOverlay" onclick="$('#port2').show(); $('#portfolioOverlaybg').fadeIn();"> 
    </div> 
</div>

这意味着网页打开的时候我会加载所有投资组合滑块的div。当人们对投资组合项目点击（在这个例子中第2项则只会显示此藏起来没有结束

现在我发现这个方法，我不知道这是一种更有效的方式：。

$(function() { 
    $('#hoverOverlay2').click(function() { 
     $('#port2').load($(this).attr('href')); 
     return false; // And prevent it following the link 
    }); 
});

因此，在这种情况下，我会实事求是地链接到文件我的服务器上加载

如果有人认为这两种方法都不是很好，你有什么建议

来源

2014-01-09 Merijn dk

- ？这有点偏爱这里。会在页面上加载额外的HTML一下子慢下来，还是不行？你喜欢一次加载所有东西吗？然后去第一条路线。

如果你想要一个更清洁的文件，并且不介意点击时加载的额外时间，请转到第二条路线。

如果你有数百个项目，第一条路线将是一个坏主意。如果你有6个，也许不是。这要取决于你想要走哪条路线，要么是合适的，但如果你的规模开始倾向于事物的大方面，那么第二条路线将更易于维护。

来源

2014-01-09 13:34:32

加载外部内容的最佳方式

回答

相关问题