hash 模式和 history 模式的实现原理

hash 模式和 history 模式的实现原理:

  • #后面的 hash 值的变化不会导致浏览器向服务器发出请求,浏览器不发出请求,就不会刷新页面。通过监听 hashchange 事件的变化可以知道 hash 值发生了哪些变化,然后根据 hash 值的变化来实现更新页面部分内容的操作
  • history 模式的实现主要是通过 HTML5 标准发布的两个 api,pushstate 和 replacestate。这两个 api 可以改变 url,但不会发出请求。这样可以监听 url 的变化来实现页面部分内容的更新。

hash 模式和 history 模式的区别主要有:
1.首先是 url 的展示上 hash 有#而 history 没有
2.刷新页面时,hash 模式可以加载 hash 值对应的页面;history 模式下如果没有处理,则会返回 404,一般需要后端对所有页面配置重定向到首页路由。
3.hash 可以兼容低版本的浏览器以及 ie

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/20211.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

vue 3.0 + element-ui MessageBox弹出框的 让文本框显示文字 placeholder

inputPlaceholder:请填写理由, 方法实现如下: this.$prompt(, 是否确认?, { confirmButtonText: 确定, cancelButtonText: 取消, inputPlaceholder:请填写理由, }).then(({ value }) > { if(value null || value ""){ Message({message: 请填…

卷积神经网络【图解CNN】

文章目录 1.卷积运算2.池化3.全连接层 卷积神经网络可以看作一个函数或者黑箱,输入就是图片的像素阵列,输出就是这个图片是什么? 图片是X,那么就输出‘x’,图片是‘O’,那么就输出O; 在计算机眼中&#xff…

如何制作VR全景地图,VR全景地图可以用在哪些领域?

引言: 随着科技的迅速进步,虚拟现实(VR)技术正逐渐渗透到各个领域。VR全景地图作为其中的重要应用之一,为人们提供了身临其境的全新体验。 一.什么是VR全景地图? VR全景地图是一种利用虚拟现实技术&…

Sprint Boot学习路线5

Spring MVC Spring MVC是Spring框架的一部分,是一个Web应用程序框架。它旨在使用Model-View-Controller(MVC)设计模式轻松构建Web应用程序。 在Spring MVC中,应用程序被分为三个主要组件:Model、View和Controller。M…

怎样做好字幕翻译服务?

我们知道,字幕泛指影视作品后期加工的文字,往往显示在电视、电影、舞台作品中。字幕翻译就是将外国影片配上本国字幕或者是将本国影片配上外国字幕。那么,字幕翻译的主要流程是什么,怎样做好字幕翻译服务? 据了解&…

【mysql复习】——单表查询知识复习

很喜欢一句话:这个世上只有一种真正的英雄主义,就是你认清了生活的真相,却仍然热爱它; 目录 条件查询(查询满足条件的数据) 注意点: 在学习数学公式以及排序等关键字时,首先你要明白他们使用在…

Android 向系统日历添加日程提醒事件

Android 向系统日历添加日程提醒事件 1.权限申请 <uses-permission android:name"android.permission.READ_CALENDAR" /> <uses-permission android:name"android.permission.WRITE_CALENDAR" /> 注意&#xff1a;6.0 以上需要申请权限才可…

企业既要用u盘又要防止u盘泄密怎么办?

企业在日常生产生活过程中&#xff0c;使用u盘交换数据是最企业最常用也是最便携的方式&#xff0c;但是在使用u盘的同时&#xff0c;也给企业的数据保密工作带来了很大的挑战&#xff0c;往往很多情况下企业的是通过u盘进行数据泄漏的。很多企业采用一刀切的方式&#xff0c;直…

【Kubernetes】

目录 一、Kubernetes 概述1、K8S 是什么&#xff1f;2、为什么要用 K8S?3、Kubernetes 集群架构与组件 二、核心组件1、Master 组件2、Node 组件3、K8S创建Pod的工作流程&#xff1f;&#xff08;重点&#xff09;4、K8S资源对象&#xff08;重点&#xff09;5、Kubernetes 核…

iOS数字转为图片

根据数字&#xff0c;转成对应的图片 - (void)viewDidLoad {[super viewDidLoad];[self testNum2String:10086]; }/// 根据数字&#xff0c;显示对应的图片 数字用特定的图片显示 - (void)testNum2String:(NSInteger)num {UIView *numContentView [[UIView alloc] initWithFr…

flask------请求拓展

flask中也有类似与django中的中间件&#xff0c;只不过是另一种写法&#xff0c;但是他们的作用是一样的&#xff0c;下面我们就一一介绍&#xff1a; 1.before_request 作用 : before_request 相当于 django 中的 process_request&#xff0c;每一个请求在被处理前都会经…

JAVA环境变量配置(windows)

windows配置环境变量&#xff08;大小写不区分&#xff09;&#xff1a; 新建JAVA_HOME&#xff1a;jdk的根目录 D:\Java\jdk1.8.0_71Path&#xff08;必须&#xff09;%JAVA_HOME%\bin新建&#xff08;类路径&#xff09;CLASSPATH: .;D:\Java\jdk1.8.0_71\lib(或者.;%JAVA_HO…

【外卖系统】套餐管理

新增套餐 需求分析 后台可以管理套餐信息&#xff0c;通过新增套餐功能来添加一个新的套餐&#xff0c;在添加套餐时需要选择当前套餐所属的套餐分类和包含的菜品&#xff0c;并需要上传套餐对应的图片。 页面发送ajax请求&#xff0c;请求服务端获取套餐分类数据并展示到下…

最细致讲解yolov8模型推理完整代码--(前处理,后处理)

研究yolov8时&#xff0c;一直苦寻不到Yolov8完整的模型推理代码演示&#xff0c;大部分人都是基于Yolo已经封装好的函数调用&#xff0c;这个网上教程很多&#xff0c;本文就不赘述这方面的内容了&#xff0c;接下来将细致全面的讲解yolov8模型推理代码&#xff0c;也就是yolo…

卡片的点击事件通过点击进行路由传参

下面是详情页 通过 接收 <template><div class"detail"><img :src"row.imgUrl"><van-icon name"arrow-left" click"back" /></div> </template><script> export default {created() {let …

Webpack 安装教程

Webpack 是一个前端资源加载/打包工具。 安装 Webpack 使用 cnpm 安装 webpack&#xff1a; cnpm install webpack -g 创建项目 接下来我们创建一个目录 app&#xff1a; mkdir app 在 app 目录下添加 runoob1.js 文件&#xff0c;代码如下&#xff1a; app/runoob1.js 文件…

LeetCode每日一题Day4——26. 删除有序数组中的重复项

✨博主&#xff1a;命运之光 &#x1f984;专栏&#xff1a;算法修炼之练气篇&#xff08;C\C版&#xff09; &#x1f353;专栏&#xff1a;算法修炼之筑基篇&#xff08;C\C版&#xff09; &#x1f433;专栏&#xff1a;算法修炼之练气篇&#xff08;Python版&#xff09; …

【分布式任务调度平台 XXL-JOB 急速入门】从零开始将 XXL-JOB 接入到自己的项目

&#x1f4a7; 分布式任务调度平台 X X L − J O B 急速入门&#xff1a;从零开始将 X X L − J O B 接入到自己的项目 \color{#FF1493}{分布式任务调度平台 XXL-JOB 急速入门&#xff1a;从零开始将 XXL-JOB 接入到自己的项目} 分布式任务调度平台XXL−JOB急速入门&#xff1a…

增强知识保护和知识管理:PDM系统的知识库特色

在现代竞争激烈的商业环境中&#xff0c;知识保护和知识管理对企业的发展至关重要。PDM系统&#xff08;Product Data Management&#xff0c;产品数据管理&#xff09;作为一款强大的数字化工具&#xff0c;具备丰富的知识库特色&#xff0c;帮助企业增强知识保护和知识管理的…

《TCP IP 网络编程》第十五章

第 15 章 套接字和标准I/O 15.1 标准 I/O 的优点 标准 I/O 函数的两个优点&#xff1a; 除了使用 read 和 write 函数收发数据外&#xff0c;还能使用标准 I/O 函数收发数据。下面是标准 I/O 函数的两个优点&#xff1a; 标准 I/O 函数具有良好的移植性标准 I/O 函数可以利用…