最佳性能+ jQuery Ajax + Div刷新

Question

有谁对jQuery Ajax刷新DIV的最佳选择有好的建议？

以下是我要实现的目标：

1. 强调性能的优化。
2. 就像Google + / Facebook一样，左侧将显示导航，右侧将显示内容窗格（DIV）。
3. 当用户单击每个导航时，内容窗格将相应刷新，而不刷新整个页面。

Answer 1

在服务器上使用不同的方法来生成内容的每个部分。这样，您可以简单地调用该方法以获取特定的内容，而不是调用通用方法并仅提取所需的内容。一旦有了获取每个内容项的独特方法，就可以将该方法的href用作链接，并使用jQuery
load方法通过AJAX检索内容并更新内容区域。

以下示例假定您的每个导航链接都具有类nav-link，并且内容区域具有id content。它还假定您已包含jQuery.js。

 <div class="menu">
     <ul>
        <li><a href="/foo" class="nav-link">Foo</a></li>
         ...
     </ul>
</div>
<div id="content">
    ... initial content...
</div>

<script type="text/javascript">
 $(function() {
     $('.nav-link').click( function() {
        var href = $(this).attr('href');
        $('#content').load( href, function() {
            // you can do something here after the content is loaded if needed
        });
        return false; // don't actually follow the link
     });
 });
</script>