jQuery Twitter / Facebook как навигация по страницам

Question

Мне очень понравилось, как новые Twitter и Facebook сохранили загрузку страниц, вместо этого загружая контент динамически через ajax.Я хочу начать распространять это на свои сайты, но я не знаю, с чего начать.

У Twitter и Facebook теперь есть такие URI: http://twitter.com/#!/messages

$(document).ready(function () {

// Check if a hash exists already and if so load that page instead.
if(window.location.hash) {
    $("div#content").load(window.location.hash);
} else {
    // load the home page.
    $("div#content").load("http://localhost/home/");
}

// Allow menu to change url hash and load new content.
$('ul#menu li a').click(function() {
    $("div#content").load(window.location.hash);
});

});

HTMLдля меню у меня есть:

<ul id="menu">
    <li>< a href="#">logout</a></li>
    <li>< a href="#!/settings">settings</a></li>
    <li>< a href="#!/messages" class="notify">messages <span>3</span></a></li>
    <li>< a href="#!/profile">profile</a></li>
    <li>< a href="#!/" class="selected">home</a></li></ul>

Есть идеи, как это делает Facebook или Twitter?

Answer 1

Похоже, вы просто спрашиваете, как работает Ajax. Лучший способ начать использовать Ajax - это jQuery, а лучший тип загрузки страниц - это текстовые файлы. Попробуйте что-то вроде этого

1) создать файл, содержащий одну букву «А». Назовите файл "A.txt".

2) создать файл, содержащий одну букву "B". Назовите файл "B.txt".

3) создайте полную страницу HTML, которая загружает jQuery, и назовите ее Test.htm. В этом файле создайте этот код:

<input type="button" class="LoadMyDiv" id="ButtonA" value="load A">
<input type="button" class="LoadMyDiv" id="ButtonB" value="load B">


 $(document).ready(function () {
       $(".LoadMyDiv").click(function() {
         $("#Adiv").load("A.txt");
         $("#Bdiv").load("B.txt");
 });
 });
<div id="ThisDiv"></div>

Answer 2

Это будет лучший ответ

надежда поможет и другим.