لقد رأيت مؤخرًا تنفيذ وضع HTML5 الخاص بـ Vue-Router ، ثم درس تاريخ HTML5 بالمناسبة.
1. التاريخHistory.PushState (State ، title ، url) ؛
يمكن أن تكون المعلمات الأولى والثانية فارغة ، ولا سيما المعلمة الثالثة ، مما يشير إلى عنوان السجل التاريخي الجديد. عنوان URL الحالي
2. التاريخ. ReplacestateHistory.Replacestate (State ، title ، url) ؛
Window.history.replacestate يشبه Window.history.pushstate. إضافة إلى نقطة السجل.
3. window.onpopstateتعال واستمع إلى تغييرات عنوان URL
window.addeventListener (popstate ، function () {varcrentState = History.state ؛/** برنامج يتم تنفيذه بعد تشغيل الحدث*/}) ؛يقوم JavaScript Script بتنفيذ Window.history.pushstate و Window.history.Replacestate لن يؤدي إلى حدوث حدث Onpopstate.
رد فعل متصفح Google و Firefox على الصفحة لأول مرة على الصفحة.
رابعًا ، يتم نشر مثال على وضع HTML5 على غرار Vue-Router أدناه. <! style.css> text/css> : 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> </viv> <script type = text/javascript src = js/jQuery-33.2.1.min.js> < /script> <script type = text/javaScript> Histor Y.Replacestate (NULL ، عنوان الصفحة ، http: //127.0.0.1: 3000/LMW/0) ؛ SearchObject = {} ؛/ *يتم استخدام هذا الكائن لحفظ عنوان URL الخاص بـ PushState كقيمة مفتاح ما يلي. /lmw/0: 0: الاستعلام == غير محدد؟ +++++ Query ، function (data) {var data2 = json.parse (data) ؛ > '+data2.data [i] function () {var query = $ (this) .index () ؛ = 0 ؛ ، http://127.0.0.1:3000/lmw/+que) ؛ : 3000/LMW/+QURY] = QUERY})}) >بالمناسبة ، انشر رمز الخادم في Node.js
var fs = request ('fs') var path = 'path') var express = request (request ('Expression') var = express () ؛ ) ؛ res.json (text.toString ())} catch (err) {res.Send ('haha! silly ، no سحب!)} app.use (جهاز التوجيه) app.listen (3000)ملاحظة: History.pushState ({pageIndex: 1} ، http://127.0.0.1:3000/lmw/+query) المعلمة الثالثة هنا تكتب مسارًا مطلقًا كاملًا ، إذا تمت كتابته كأسراب ، فسيتم إضافة المسار مع عنوان URL غير المحدود كاستعلام ، لأن المسار النسبي يجب أن يكون عنوان URL الحالي
يتم وضع الخادم باستخدام Data0.json ، data1.json ، Data2.json لمحاكاة قاعدة البيانات للحصول على البيانات. ثم أرسل إلى الواجهة الأمامية
ما سبق هو وضع HTML5 الذي قدمه Xiaobian. شكرا جزيلا لدعمكم لموقع VEVB Wulin!