Недавно я увидел реализацию истории HTML5 Vue-Router, а затем изучал историю HTML5.
1. ИСТОРИЯ. ПушстатИСТОРИЯ.pushstate (штат, название, URL);
Первый и второй параметры, приведенные выше, могут быть пустыми, в основном третий параметр, указывающий на адрес новой исторической записи. Текущий URL
2. ИСТОРИЯ.replacestateИстория.
Window.history.Replacestate аналогично Window.history.pushstate. добавлен в рекордную точку.
3. window.onpopstateПриходите и послушайте изменения URL
Window.addeventListener (popstate, function () {varcretState = vistory.state;/** Программа для выполнения после запуска события*/});
JavaScript Script выполняет window.history.pushstate и window.history.replacestate не запускает событие OnPopstate.
Реакция браузера Google и Firefox Browser на странице в первый раз на странице отличается.
В-четвертых, пример режима HTML5, похожий на Vue-Router, опубликован ниже.<! Стиль : 30px; <body> <div 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> <script type = text/javascript src = js/jquery-3.2.2.1.min.js> < /script> <script type = text/javaScript> Историл Y.Replacestate (NULL, заголовок страницы, http: //127.0.0.0.1: 3000/lmw/0); searchObject = {};/ *Этот объект используется для сохранения URL -адреса PushState в качестве следующего значения. /lmw/0: 0: 0}/var factor = function () {var addva = document.href; Query == не определено? 0: запрос); +++++ Query, function (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); : 3000/LMW/+Qury] = Query})}}) // запустить событие Popstate, если браузер идет вперед или отступает >
Кстати, опубликуйте код сервера в node.js.
Var fs = request ('fs') var path = reques ('path') var express = request = request ('Express') var app = express (); ); Res.json (text.tostring ())} catch (err) {res.send ('ха -ха! Глупо, без притяжения!)}) App.use (router) app.listen (3000)
ПРИМЕЧАНИЕ: inistory.pushstate ({pageindex: 1}, http://127.0.0.1:3000/lmw/+query). Третий параметр здесь записывает полный абсолютный путь, если он написан как относительный Неограниченный URL как запрос, потому что относительный путь он должен быть текущим URL
Сервер размещен с Data0.json, data1.json, data2.json для моделирования базы данных для получения данных. а затем отправьте на переднюю часть
Приведенный выше режим истории в HTML5, представленном Xiaobian. Большое спасибо за вашу поддержку на веб -сайте Vevb Wulin!