[javascript] 해시없이 새 URL로 주소 표시 줄 업데이트 또는 페이지 다시로드

Program / 글쓴이

페이지를 다시로드하지 않고 자바 스크립트 (도메인이 아닌 경로)를 통해 주소 표시 줄을 업데이트하는 방법을 구현하는 크롬 (dev 채널)에 대한 꿈을 꾸었거나 실제로이 작업을 수행했습니다.

그러나 내가 읽은 것으로 생각 되는 기사를 찾을 수 없습니다 .

내가 미쳤거나 이것을 할 수있는 방법이 있습니까 (Chrome에서)?

추신 : 나는 window.location.hash, et al.에 대해 이야기하고 있지 않습니다. 위의 내용이 존재 하면이 질문에 대한 답 은 사실이 아닙니다.

답변

이제 대부분의 “현대”브라우저에서이 작업을 수행 할 수 있습니다!

다음은 내가 읽은 원본 기사입니다 (2010 년 7 월 10 일 게시). HTML5 : 페이지를 새로 고치지 않고 브라우저 URL 변경 .

pushState / replaceState / popstate (일명 HTML5 히스토리 API)에 대한 자세한 내용은 MDN 문서를 참조하십시오 .

TL; DR, 당신은 이것을 할 수 있습니다 :

window.history.pushState("object or string", "Title", "/new-url");

기본적인 사용법 은 페이지 를 다시로드하지 않고 URL 수정에 대한 답변을 참조하십시오 .

답변

해시 이후의 내용 만 변경-이전 브라우저

document.location.hash = 'lookAtMeNow';

전체 URL 변경 크롬, 파이어 폭스, IE10 +

history.pushState('data to be passed', 'Title of the page', '/test');

위의 내용은 기록에 새 항목을 추가하므로 뒤로 버튼을 눌러 이전 상태로 이동할 수 있습니다. 기록에 새 항목을 추가하지 않고 URL을 제자리에 변경하려면

history.replaceState('data to be passed', 'Title of the page', '/test');

지금 콘솔에서 이것을 실행하십시오!

답변

pushstate를 지원하지 않는 브라우저를 감지하기 위해 Davids의 답변으로 업데이트하십시오.

if (history.pushState) {
  window.history.pushState("object or string", "Title", "/new-url");
} else {
  document.location.href = "/new-url";
}

답변

var newurl = window.location.protocol + "//" + window.location.host + window.location.pathname + '?foo=bar';
window.history.pushState({path:newurl},'',newurl);

답변