>웹 프론트엔드 >JS 튜토리얼 >JavaScript를 사용하여 페이지를 다시 로드하지 않고 브라우저 URL을 어떻게 변경할 수 있습니까?

JavaScript를 사용하여 페이지를 다시 로드하지 않고 브라우저 URL을 어떻게 변경할 수 있습니까?

Mary-Kate Olsen
Mary-Kate Olsen원래의
2024-12-16 18:27:11684검색

How Can I Change the Browser URL Without Reloading the Page Using JavaScript?

JavaScript를 사용하여 페이지를 다시 로드하지 않고 브라우저 URL 변경

JavaScript를 사용하면 새 페이지를 로드하지 않고 브라우저 URL을 변경할 수 있습니다. 이를 통해 주소 표시줄의 주소를 수정하는 동안 페이지의 현재 상태를 유지할 수 있습니다.

한 가지 접근 방식은 window.location.hash 속성을 사용하는 것입니다. 해시를 특정 값으로 설정하면 페이지를 다시 로드하지 않고도 상태 정보를 인코딩할 수 있습니다. window.onhashchange 이벤트를 지원하는 브라우저는 해시 변경 사항을 수신하고 그에 따라 페이지를 업데이트할 수 있습니다. onhashchange를 기본적으로 지원하지 않는 이전 브라우저에서는 해시 변경 사항을 감지하기 위해 setInterval을 사용하여 정기적인 확인이 필요합니다.

jQuery는 다양한 브라우저에서 해시 변경 사항 처리를 단순화하는 hashchange 플러그인을 제공합니다. 이 플러그인을 사용하면 새 해시 값을 기반으로 페이지를 동적으로 업데이트할 수 있습니다.

페이지를 다시 로드하지 않고 URL을 수정하는 또 다른 방법은 기록 조작을 이용하는 것입니다. History.pushState(null, null, "new_url")을 호출하면 현재 페이지를 떠나지 않고도 브라우저 기록에 새 항목을 추가할 수 있습니다. 마찬가지로, 전체 페이지를 다시 로드하지 않고도 기록을 탐색하는 데 History.back() 및 History.forward() 메서드를 사용할 수 있습니다. 그러나 이러한 방법을 사용하려면 HTML5 History API에 대한 브라우저 지원이 필요하며 이는 모든 브라우저에서 사용할 수 없습니다.

위 내용은 JavaScript를 사용하여 페이지를 다시 로드하지 않고 브라우저 URL을 어떻게 변경할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.