Εισήχθη από το Gecko2 (Firefox 4 / Thunderbird 3.3 / SeaMonkey 2.1)
Η HTML5 εισάγει δύο μεθόδους, την histtory.pushState() και την history.replaceState(), οι οποίες επιτρέπουν την προσθήκη και την τροποποίηση οντοτήτων ιστορικού. Ταυτόχρονα, αυτές οι μέθοδοι λειτουργούν με το συμβάν window.onpostate.
Τροποποιήστε τον σύνδεσμο παραπομπής χρησιμοποιώντας τη μέθοδο history.pushState(), η οποία μπορεί να χρησιμοποιηθεί στην κεφαλίδα http που δημιουργήθηκε για το αντικείμενο xmlhttpRequest μετά την τροποποίηση της κατάστασης. Αυτός ο σύνδεσμος παραπομπής θα είναι η διεύθυνση URL του εγγράφου κατά τη δημιουργία του XMLHttpRequest.
Το pushState χρησιμοποιείται για την προσθήκη μιας εγγραφής της τρέχουσας σελίδας στο ιστορικό, ενώ το replaceState και το pushState χρησιμοποιούνται ακριβώς το ίδιο, η μόνη διαφορά είναι ότι χρησιμοποιείται για την τροποποίηση της εγγραφής της τρέχουσας σελίδας στο ιστορικό.
παράδειγμα
Ας υποθέσουμε ότι http://mozilla.org/foo.html σελίδα εκτελεί JS
var stateObj = { foo: "bar" }; history.pushState(stateObj, "σελίδα 2", "bar.html");
Αυτή η μέθοδος θα κάνει τη γραμμή διευθύνσεων URL να εμφανίζεται http://mozilla.org/bar.html,Αλλά το πρόγραμμα περιήγησης δεν θα φορτώσει bar.html σελίδα, ακόμα κι αν υπάρχει。
Τώρα και πάλι ας υποθέσουμε ότι ο χρήστης συνεχίζει να έχει πρόσβαση στο http://google.com και κάνει κλικ πίσω. Προς το παρόν, η γραμμή διευθύνσεων url θα http://mozilla.org/bar.html, η σελίδα θα λάβει ένα συμβάν popstate (chrome), το οποίο θα περιέχει ένα αντίγραφο του stateObj. Αυτή η σελίδα μοιάζει με foo.html. +
Σε αυτό το σημείο, κάνουμε ξανά κλικ πίσω και η διεύθυνση URL θα γυρίσει http://mozilla.org/foo.html,document θα λάβει ένα άλλο συμβάν popstate και ένα αντικείμενο μηδενικής κατάστασης. Αυτή η ενέργεια επιστροφής δεν αλλάζει το περιεχόμενο του εγγράφου. (Ίσως μετά από λίγο να προσπαθήσει να φορτώσει...) χρώμιο)
μέθοδος pushState
Η pushState() έχει τρεις παραμέτρους: αντικείμενο κατάστασης, τίτλος (τώρα αγνοείται, χωρίς χειρισμό), URL (προαιρετικό). Λεπτομέρειες:
· state object – Το state object είναι ένα αντικείμενο Javascrip{filter}t που σχετίζεται με μια νέα οντότητα ιστορικού που δημιουργήθηκε με τη μέθοδο pushState(). Χρησιμοποιείται για την αποθήκευση πληροφοριών σχετικά με τις καταχωρήσεις που θέλετε να εισαγάγετε στο ιστορικό. Το αντικείμενο State μπορεί να είναι οποιαδήποτε συμβολοσειρά Json. Επειδή ο Firefox χρησιμοποιεί τον σκληρό δίσκο του χρήστη για πρόσβαση στο αντικείμενο κατάστασης, ο μέγιστος αποθηκευτικός χώρος αυτού του αντικειμένου είναι 640k. Εάν είναι μεγαλύτερη από αυτήν την τιμή, η μέθοδος pushState() δημιουργεί μια εξαίρεση. Εάν χρειάζεστε περισσότερο χώρο για αποθήκευση, χρησιμοποιήστε τοπικό χώρο αποθήκευσης.
· title—Ο Firefox αγνοεί αυτήν την παράμετρο τώρα, αν και μπορεί να χρησιμοποιηθεί στο μέλλον. Ο ασφαλέστερος τρόπος για να το χρησιμοποιήσετε τώρα είναι να περάσετε μια κενή συμβολοσειρά για να αποτρέψετε μελλοντικές τροποποιήσεις. Ή μπορείτε να περάσετε έναν σύντομο τίτλο για να υποδείξετε την πολιτεία
· URL - Αυτή η παράμετρος χρησιμοποιείται για τη μεταβίβαση της διεύθυνσης URL της νέας οντότητας ιστορικού, σημειώστε ότι το πρόγραμμα περιήγησης δεν θα φορτώσει αυτήν τη διεύθυνση URL μετά την κλήση της μεθόδου pushState(). Αλλά ίσως μετά από λίγο να προσπαθήσει να φορτώσει αυτό το URL. Για παράδειγμα, μετά την επανεκκίνηση του προγράμματος περιήγησης από τον χρήστη, η νέα διεύθυνση URL μπορεί να μην είναι απόλυτη διαδρομή. Εάν πρόκειται για σχετική διαδρομή, τότε θα είναι σχετική με την υπάρχουσα διεύθυνση URL. Το νέο url πρέπει να είναι συν-τομέας με το υπάρχον url, διαφορετικά το pushState() θα δημιουργήσει μια εξαίρεση. Αυτή η παράμετρος είναι προαιρετική και, εάν είναι κενή, θα τοποθετηθεί ως η τρέχουσα διεύθυνση URL του εγγράφου.
Κατά μία έννοια, η κλήση της μεθόδου pushState() μοιάζει πολύ με τη ρύθμιση window.locatio{filter}n = "#foo", τα οποία δημιουργούν και ενεργοποιούν μια άλλη οντότητα ιστορικού που σχετίζεται με το τρέχον έγγραφο, αλλά η pushState() έχει μερικά επιπλέον πλεονεκτήματα:
Η νέα διεύθυνση URL μπορεί να είναι οποιαδήποτε διεύθυνση URL που βρίσκεται στον ίδιο τομέα με την τρέχουσα διεύθυνση URL, σε αντίθεση με το window.locatio{filter}n που παραμένει στο ίδιο έγγραφο εάν έχει οριστεί μόνο κατακερματισμός.
l Μπορείτε να αφήσετε τη διεύθυνση URL αμετάβλητη εάν δεν χρειάζεται. Για σύγκριση, ορίστε window.locatio{filter}n = "#foo"; Δημιουργούνται μόνο νέες οντότητες ιστορικού, εάν ο τρέχων κατακερματισμός σας δεν είναι #foo
Μπορείτε να συσχετίσετε αυθαίρετα δεδομένα με τη νέα οντότητα ιστορικού. Με μια προσέγγιση που βασίζεται στον κατακερματισμό, όλα τα σχετικά δεδομένα πρέπει να κωδικοποιηθούν σε μια σύντομη συμβολοσειρά.
Σημειώστε ότι η μέθοδος pushState() δεν κάνει τον χρόνο αλλαγής κατακερματισμού, ακόμα κι αν το παλιό και το νέο url είναι απλώς διαφορετικοί κατακερματισμοί.
μέθοδος replaceState()
Το history.replaceState() χρησιμοποιείται πολύ όπως το pushState(), εκτός από το ότι το replaceState() χρησιμοποιείται για την τροποποίηση της τρέχουσας οντότητας ιστορικού αντί για τη δημιουργία μιας νέας. Αυτή η μέθοδος μπορεί μερικές φορές να είναι χρήσιμη όταν χρειάζεται να ενημερώσετε ένα αντικείμενο κατάστασης ή την τρέχουσα οντότητα ιστορικού ως απόκριση σε συγκεκριμένη συμπεριφορά χρήστη και μπορείτε να τη χρησιμοποιήσετε για να ενημερώσετε τη διεύθυνση URL του αντικειμένου κατάστασης ή της τρέχουσας οντότητας ιστορικού.
Εκδήλωση Popstate
Όταν αλλάξει η οντότητα ιστορικού, θα προκύψει το συμβάν popstate. Εάν η οντότητα ιστορικού δημιουργείται από τις μεθόδους pushState και replaceState, το χαρακτηριστικό κατάστασης του συμβάντος popstate θα περιέχει ένα αντίγραφο του αντικειμένου κατάστασης από την οντότητα ιστορικού
Δείτε το window.onpopstate για λεπτομέρειες
Διαβάστε την τρέχουσα κατάσταση
Διαβάστε την υπάρχουσα κατάσταση
Όταν φορτώνεται η σελίδα, μπορεί να έχει ένα μη κενό αντικείμενο κατάστασης. Αυτό μπορεί να συμβεί όταν η σελίδα ορίζει ένα αντικείμενο κατάστασης (χρησιμοποιώντας pushState ή replaceState) και ο χρήστης επανεκκινεί το πρόγραμμα περιήγησης. Όταν η σελίδα φορτωθεί ξανά, η σελίδα θα λάβει ένα συμβάν onload, αλλά δεν θα υπάρχει συμβάν popstate. Ωστόσο, εάν διαβάσετε την ιδιότητα history.state, θα λάβετε αυτό το αντικείμενο κατάστασης μετά την εμφάνιση του συμβάντος popstate
Τεκμηρίωση History.pushState(): https://developer.mozilla.org/zh-CN/docs/Web/API/History/pushState
Η παράμετρος της διεύθυνσης URL λήψης είναι τύπου συμβολοσειρά, η οποία χρησιμοποιείται για την αλλαγή της διεύθυνσης URL της τρέχουσας γραμμής διευθύνσεων. Ένα πράγμα που πρέπει να σημειωθεί είναι ότι αυτή η παράμετρος δεν μπορεί να είναι ίδια με τη διατομεακή, δηλαδή το πρωτόκολλο, το όνομα τομέα και η θύρα πρέπει να είναι τα ίδια.
Uncaught DOMException: Απέτυχε η εκτέλεση του 'pushState' στο 'History': Ένα αντικείμενο κατάστασης ιστορικού με URL 'http://www.test.com/' δεν μπορεί να δημιουργηθεί σε ένα έγγραφο με προέλευση ' https://www.itsvse.com" και URL "https://www.itsvse.com/".
σε <anonymous>:1:9
Σωστός κωδικός:
|
Δημοσιεύτηκε στις 12/9/2017 1:55:04 μ.μ.
|
|
|
|
Δημοσιεύτηκε στις 27/10/2017 9:51:10 π.μ.