HTML5 Pushstate, Popstate Operation History, Brushless Refresh 변경 현재 URL에 대한 자세한 설명

Window.history는 사용자가 적극적으로 생성하고 JavaScript 스크립트로 제어되는 글로벌 객체를 수락하는 Window 객체의 과거 기록을 나타냅니다. 창 객체는 역사 객체를 통해 스피커의 역사적 기록에 대한 액세스를 제공합니다. 매우 유용한 방법과 속성을 노출시켜 역사적 기록에서 앞으로 나아가고 후퇴 할 수 있습니다.

역사적 기록에서 후퇴하면 다음을 수행 할 수 있습니다.

 Window.history.back ();

이것은 사용자가 브라우저의 뒤로 버튼을 클릭하는 것과 같습니다.

마찬가지로 브라우저에서 전달 버튼을 클릭하는 것처럼 다음과 같이 앞으로 나아갈 수 있습니다.

 Window.history.forward ();

현재 페이지 위치와 비교하여 값을 지정하면 go () 메소드를 사용하여 현재 세션의 히스토리 레코드에서 페이지를로드 할 수 있습니다 (현재 페이지 위치 색인 값은 0, 이전 페이지는 -1이고 다음 페이지는 1)입니다.

한 페이지를 퇴각하려면 (Calling ()에 해당) :) :

 Window.history.go (-1);

한 페이지를 앞으로 이동합니다 (call forward ()와 동일) :

 Window.history.go (1);

유사한 Pass Parameter 2는 앞으로 2 개의 레코드 포인트를 이동할 수 있습니다. 길이 속성 값과 과거 기록 스택에 몇 개의 레코드 포인트 수를 볼 수 있습니다.

 Window.history.length;

HTML5의 새로운 API는 확장 된 창을 가지고있어 역사적으로 역사적 기록 지점이 더 열려 있습니다. 현재의 역사적 기록을 저장하고, 현재의 역사적 기록을 교체하며, 역사적 기록을 간략하게 설명하겠습니다.

저장된 메소드는 스택의 배열 (Array.push ())와 유사하며 새로운 역사적 레코드 포인트가 Window.history (예 : ::)에 추가됩니다.

 // 현재 URL은 다음과 같습니다. http://qianduanblog.com/index.htmlvar json = {gettime ()}; 브라우저는 URL이 존재하는지 확인하지 않으며 URL은 동일한 도메인이어야합니다.

푸시 스테이트 메소드가 실행 된 후 페이지의 URL 주소는 http://qianduanblog.com/post -html입니다.

window.replacestate는 Window.history.pushstate와 유사합니다 레코드 포인트에 추가되었습니다. 사용자의 특정 작업에 응답하여 현재 과거 기록 항목의 상태 객체 또는 URL을 업데이트 해야하는 경우 replacestate () 메소드를 사용하여 특히 적절합니다.

모니터링의 역사적 기록, 직관적 인 것은 URL의 변경으로 간주 될 수 있지만 URL의 해시 부분을 무시하고 URL의 해시를 듣습니다 내 블로그 의이 방법과 크로스 브라우저 도이 방법과 Crossbrowler에 대해 말합니다. Window.onpopState를 통해 URL의 변경 사항을들을 수 있으며 위에서 언급 한 JSON 객체 인 역사적 레코드 지점에 저장된 상태 객체를 얻을 수 있습니다.

 // 현재 URL은 다음과 같습니다. http://qianduanblog.com/post -htmlwindow.onpopstate = function () {// historical record point var json = window.history.state에 저장됩니다 반환 : http://qianduanblog.com/index.html // json은 {time : 1369647895656}}입니다.

JavaScript 스크립트를 실행합니다.

또한 페이지에서 Google 브라우저와 Firefox 브라우저의 반응은 OnPopState 이벤트를 복구하는 것이 아니라 Firefox 브라우저는 그렇지 않습니다.

위의 푸시 스테이트 및 팝 스테이트 작업에 대한 자세한 설명은 현재 URL을 변경합니다 시간. VEVB WULIN 웹 사이트를 지원해 주셔서 대단히 감사합니다!