Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Bom galera, estava lendo esse artigo sobre AJAX+SEO+HTML5 e como sou noob ainda nessa area nao consegui entender direito como utilizar.
Para entenderem melhor segue artigo que estou falando.
Se resume em usar AJax com tecnicas de SEO.
porem não entendi direito como usar a função
$('nav a').click(function(e) {
url = $(this).attr("href");
//This function would get content from the server and insert it into the id="content" element
$.getJSON("content.php", {contentid : url},function (data) {
$("#content").html(data);
});
//This is where we update the address bar with the 'url' parameter
window.history.pushState('object', 'New Title', url);
//This stops the browser from actually following the link
e.preventDefault();
}Mais precisamente não consegui entender essa parte,
$.getJSON("content.php", {contentid : url},function (data) {
$("#content").html(data);
});Sei que se baseia mais na compreensão de getJson mas se puderem me ajudar não entendi muito na documentação.
Pelo que entendi ela vai buscar o arquivo content.php e escrever no elemento com id content, porem estava fazendo os testes e não consegui fazer funcionar, pra que serve contentid : url ?
Se não for pedir muito se alguém puder postar aqui ou no github o código de um exemplo dessa utilização.
Acho que clareou mais um pouco. mas isso pra ele processar o GET seria opcional no caso certo? seu fizesse essa pagina com um simples texto html ele ja carregaria o texto normalmente ?
no código que voce colocou o trecho
+ ' #content'
seria o elemento aonde ele iria ler e retornar na pagina?
Esse + ' #content', é um contexto que estou passando para o .load().
Assim mesmo que tenha outras áreas no arquivo requisitado, o .load() vai fazer o parser do html e inserir apenas o conteudo do elemento com id="content" daquele arquivo que pedi.
Beleza cara, muito obrigado... vou fazer os testes aqui.
Willian, estou tentando fazer pelo metodo load. Ele carrega normalmente a pagina e cria o path também.
Porem quando utilizo o botão voltar ele troca apenas a url mas nao o conteúdo da pagina. consegue me ajudar?
$(function() {
$('nav a').click(function(e) {
url = $(this).attr("href");
loadContent(url);
window.history.pushState('object', 'New Title', url);
e.preventDefault();
});
window.onpopstate = function(event) {
console.log("pathname: "+location.pathname);
loadContent(location.pathname);
};
});
function loadContent(url){
$("#content").load(url);
}ai vc precisa implementar o evento onPopState
Então mas eu estou utilizando, esta errado dessa forma?
window.onpopstate = function(event) {
console.log("pathname: "+location.pathname);
loadContent(location.pathname);
};
essa parte: contentid : url, serve para enviar um get para o teu arquivo php.
O mesmo que:
content.php?contentid=url
assim, o teu content.php processaria esse $_GET, e devolveria o conteudo para ser inserido.
Só que isso não é bem necessário, e vc pode, no lugar do getJSON fazer assim:
$("#content").load( url + ' #content');entendeu ?