Cập nhật thanh địa chỉ bằng URL mới mà không cần băm hoặc tải lại trang

Tôi mơ ước về chrome (kênh dev) thực hiện cách cập nhật thanh địa chỉ thông qua javascript (đường dẫn, không phải tên miền) mà không tải lại trang hoặc họ thực sự đã làm điều này.

Tuy nhiên, tôi không thể tìm thấy bài báo tôi nghĩ rằng tôi đã đọc.

Tôi có điên không hay có cách nào để làm điều này (trong Chrome) không?

ps Tôi không nói về window.location.hash, et al. Nếu ở trên tồn tại câu trả lời cho câu hỏi này sẽ không đúng sự thật.

Bây giờ bạn có thể làm điều này trong hầu hết các trình duyệt "hiện đại"!

Đây là bài viết gốc tôi đã đọc (đăng ngày 10 tháng 7 năm 2010): HTML5: Thay đổi URL trình duyệt mà không cần làm mới trang .

Để có cái nhìn sâu hơn về PushState / thay thếState / popstate (còn gọi là API Lịch sử HTML5), hãy xem các tài liệu MDN .

TL; DR, bạn có thể làm điều này:

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

Xem câu trả lời của tôi để Sửa đổi URL mà không cần tải lại trang để biết cách thực hiện cơ bản.

Chỉ thay đổi những gì sau khi băm - trình duyệt cũ

document.location.hash = 'lookAtMeNow';

Thay đổi URL đầy đủ. Chrome, Firefox, IE10 +

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

Ở trên sẽ thêm một mục mới vào lịch sử để bạn có thể nhấn nút Quay lại để đi đến trạng thái trước đó. Để thay đổi URL tại chỗ mà không cần thêm mục nhập mới vào lịch sử, hãy sử dụng

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

Hãy thử chạy chúng trong giao diện điều khiển ngay bây giờ!

Cập nhật lên câu trả lời của Davids để thậm chí phát hiện các trình duyệt không hỗ trợ Pushstate:

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);