So ändern Sie die Seiten-URL mit JavaScript

Question

Ich bin neuer auf JavaScript und ich arbeite an einer Website, wo ich in der Lage sein soll, die URL zu wechseln, wenn ich auf bestimmte Elemente der Website klicken, ohne die Seite neu zu laden.

Ich möchte es wie http://www.itemcycle.com arbeiten, wenn Sie auf den Link klicken, um Ihr iPad oder iPhone zu verkaufen und dann wählen Sie Ihr Modell. Es zeigt verschiedene Kästchen an, und wenn Sie darauf klicken, ändert sich die URL, aber ich weiß, dass es keine neue Seite lädt, weil es mich nicht zurück nach oben scrollt.

Vielen Dank im Voraus für Ihre Hilfe!

Answer 1

, was Sie sehen eine einzelne Seite Anwendung ist

Eine Single-Seite Anwendung (SPA), auch Einzelseiten-Schnittstelle (SPI), bekannt als, ist eine Web-Anwendung oder Website, die auf paßt eine einzige Webseite mit dem Ziel, eine flüssigere Benutzererfahrung ähnlich einer Desktop-Anwendung zu bieten.

Dies wird durch die Verwendung bestimmter JS-Frameworks erreicht. AngularJS ist die beliebteste.

Answer 2

Versuchen Sie folgendes:

window.location.href="/yourUrl"; 

Answer 3

HTML5 die history.pushState eingeführt(), die Sie Geschichte Einträge hinzufügen und ändern können.

window.history.pushState('page1', 'Title', '/page1.php'); 

Dies könnte sich sehen lassen.

Answer 4

ist es 2 wichtigsten Möglichkeiten, um einen Benutzer umgeleitet werden, von denen jeder mit seinen Kompromissen:

1. Sie können einen Benutzer zu einer neuen Seite umleiten, indem Sie den Wert von window.location.href ändern. So wird zum Beispiel window.location.href='https://example.com'; einen Benutzer zu https://example.com umleiten. Beachten Sie, dass das Neuladen einer harten Seite erforderlich ist, sodass die Seite tatsächlich neu geladen wird.

2. Um den URL-Pfad zu ändern, ohne den Benutzer auf eine neue Seite umzuleiten, können Sie history.pushState verwenden. Doing so etwas wie:

   history.pushState({}, "page 2", "/page2");

   wird die URL https://example.com-https://example.com/page2 und die Scroll-Position ändern wird sich nicht ändern. Sie können dann Änderungen von history.pushState hören und die Seite entsprechend aktualisieren, um den gewünschten Effekt zu erzielen. Beachten Sie, dass Sie die Domäne nicht ändern können (d. H. Sie können nicht von https://example1.com zu https://example2.com gehen), aber auf der Plusseite wird die Seite nicht wirklich neu geladen.

Wie andere haben darauf hingewiesen, gibt es verschiedene Frameworks mit denen Sie diese Art der Sache zu tun, aber die Rahmenbedingungen sind die Nutzung der Techniken, die ich oben beschrieben habe.