Cargar contenido oculto al mostrarlo con jQuery

[CorpseOfSteel]

Buenas, vereis tengo una web con varias secciones, pero en vez de hacer una página diferente por sección, las he puesto todas en el index ocultas con css. Cuando hago click en los botones del menú se muestra la sección correspondiente con jQuery. Hasta aquí todo bien.

El problema es que si entro en la web (index) y miro el código fuente, veo que me carga el código de todo el sitio completo con todas las secciones, textos, imágenes, etc, por lo que hace la web muy lenta.

Mi idea es que al entrar en la web sólo cargue el código que se ve, y cuando haga click en un botón del menú, en ese momento, me cargue el código de la sección y la muestre en la misma página.

Más o menos como los antiguos frames de HTML, pero más actualizado.

No se si con jQuery se puede hacer esto, sino pues con Javascript o PHP o lo que sea, escucho cualquier sugerencia.

Muchas gracias de verdad por adelantado!!

[doylelives]

ajax, simplemente con ajax.
Aunque podrias hacerlo con php pasando un valor por get para determinar que sección mostrar pero prefiero lo primero.

[CorpseOfSteel]

con Ajax... Gracias por tu respuesta tan rápida. El problema es que nunca he usado Ajax, ¿sería muy complejo de hacer?. Si pudierais decirme algo más os lo agradecería mucho ya que no tengo ni idea. ¿Me olvido entonces de hacerlo con jQuery?

[Dany_s]

sis usas jquery no es muy difícil, fijate la doc que tiene buenos ejemplos

http://api.jquery.com/jQuery.ajax/

[CorpseOfSteel]

Muchas gracias Dany_s, ya estoy leyendo la información.

Aprovecho para otra pregunta relacionada, ¿seria posible que cuando me cargue una sección, la URL también cambie? (por ejemplo de misitio.com a misitio.com/seccion-uno/), y que en el caso de que alguien entre a dicha URL directamente, la sección ya esté cargada. No se si me explico.

[tredio]

Iniciado por CorpseOfSteel

¿seria posible que cuando me cargue una sección, la URL también cambie?

al cambiar la url la pagina se va a refrescar y bueno creo que eso es exactamente lo que no quieres que suceda, puedes usar "hash" para hacer eso.

ejemplo: www.misitio.com#seccion-1

en el ready del document podrias ver si hay algun hash en la url y dependiendo de eso cargar una seccion especifica.

Código Javascript:

$(document).ready(function(){
    var seccion = window.location.hash.replace('#','');
    if(seccion != ''){
        //CARGAS LA SECCION
    }
});
 

[CorpseOfSteel]

Muchas gracias tredio, creo que eso es lo que necesito, voy a hacer unos cuantos experimentos cuando tenga un hueco y comento por aqui si tengo alguna duda más específica.

Gracias a todos de nuevo!