Soy realmente nuevo en JS/jQuery/Ajax. Tengo este código. Quiero que el contenido de la etiqueta del artículo cambie, pero que el resto (encabezado, menú y pie de página) permanezca igual mientras el usuario hace clic en un enlace del sitio web. Absolutamente no quiero que la página completa se recargue por completo porque causa una mala experiencia de usuario. Esto funciona perfectamente y el código está cargando la nueva página, el título cambia cuando hace clic en un enlace PERO el botón Atrás del navegador ya no funciona, el título sigue siendo el mismo que el de la página en la que estaba, realmente molesto. ¿Qué debo hacer para solucionar este problema realmente molesto?

 $(function() { var $article = $("article"), init = function() { // Do this when a page loads. }, ajaxLoad = function(html) { document.title = html .match(/<title>(.*?)<\/title>/)[1] .trim(); init(); }; init(); $(document).on("click", "a, area", function() { var href = $(this).attr("href"); history.pushState({}, '', href); $article.load(href + " article>*", ajaxLoad); return false; }); });

¡Muchas gracias por su ayuda!