Baru-baru ini saya melihat implementasi mode sejarah HTML5 Vue-Router, dan kemudian mempelajari sejarah HTML5 dengan cara yang terjadi.
1. History.pushstateHistory.pushstate (state, judul, url);
Parameter pertama dan kedua di atas dapat kosong, terutama parameter ketiga, menunjukkan alamat catatan sejarah baru. URL saat ini
2. Sejarah.Replacestatehistory.replacestate (negara bagian, judul, url);
Window.history.replacestate mirip dengan window.history.pushstate. ditambahkan ke titik rekaman.
3. Window.onpopstateDatang dan dengarkan perubahan URL
Window.addeventListener (popstate, function () {varcrentState = history.state;/** program untuk dieksekusi setelah memicu acara*/});Skrip JavaScript mengeksekusi window.history.pushstate dan window.history.replacestate tidak akan memicu acara OnpopState.
Reaksi Browser Google dan Browser Firefox pada halaman untuk pertama kalinya di halaman berbeda.
Keempat, contoh mode html5 yang mirip dengan vue-router diposting di bawah ini. <! Style.css> <Style Type = Text/CSS> .Container-BG {Width: 1000px; : 30px; <body> <v class = container-bg> <ul class = pagination> <li> 1 </li> <li> 2 </li> <li> 3</ul></ul></ul> < /ul ></ul></ul> </ul> UL class = ptting> </ul> </div> <type skrip = teks/javascript src = js/jQuery-3.2.1.min.js> < /skrip> <type skrip = teks/javascript> history y.replacestate (null, judul halaman, http: //127.0.0.0.1: 3000/lmw/0); SearchObject = {};/ *Objek ini digunakan untuk menyimpan URL dari pushstate sebagai yang berikut. /lmw/0: 0: 0}/var factor = function () {var addva = document.href; kueri == tidak ditentukan? +++++ kueri, fungsi (data) {var data2 = json.parse (data); >+data2.data [i] .name+'</li>'} $ ('. Ptting'). function () {var query = $ (this) .index (); = 0; , http://127.0.0.1:3000/lmw/+que); ; >Ngomong -ngomong, posting kode server di Node.js.
Var fs = request ('fs') var path = reques ('path') var express = request = request ('ekspresi') var app = express (); ); Res.json (text.toString ())} catch (err) {res.send ('haha! Konyol, tidak ada tarik!)}) App.use (router) app.listen (3000)Catatan: history.pushState ({pageIndex: 1}, http://127.0.0.1:3000/lmw/+query) Parameter ketiga di sini menulis jalur absolut yang lengkap, jika ditulis sebagai relatif jalur akan ditambahkan dengan URL yang tidak terbatas sebagai kueri, karena jalur relatif harus menjadi URL saat ini
Server ditempatkan dengan data0.json, data1.json, data2.json untuk mensimulasikan database untuk mendapatkan data. Dan kemudian kirim ke ujung depan
Di atas adalah mode sejarah dalam HTML5 yang diperkenalkan oleh Xiaobian. Terima kasih banyak atas dukungan Anda untuk situs web VEVB Wulin!