路由-前端路由和后端路由的概念|学习笔记

简介: 快速学习路由-前端路由和后端路由的概念

开发者学堂课程【Vue.js 入门与实战路由-前端路由和后端路由的概念】学习笔记,与课程紧密联系,让用户快速学习知识。

课程地址https://developer.aliyun.com/learning/course/586/detail/8190


路由-前端路由和后端路由的概念


内容简介

一、后端路由

二、前段路由

三、URL中的hash(井号)

 

一、后端路由

对于通的风些一所本的超时技都是 URL 地址,所有的 URL 地址都对应服好器上对应的资源;

 

二、前段路由

对于单页面应用程序来说,主要通过 UR L 的 hash#来实现不向页面之间的切换,同时 hash 有一个特点:HTTP 请求中不会包会 hash 根关的内容所以,单页面程序中的页面跳转主要用 hash 实现

在单页面应用程产中,这种通hash 改变切换页面的方式称作前端路由(区别于后端路由) :

Hash 就是在网页网址后面加上#/log,如下图:

image.png

 

三、URL 中的 hash(井号)

#代表网页中的一个位置,其右边的字符,就是读位置的标识符,比如:

http://www.example.com/index.html#print

就是代表 index.html 中的 print 位置。浏览器会自动把 print 位置滚动到页面可视区域内。

设置方法:

Step1:设置一个锚点#print>定位到print位置

Step2:在页面需要定位的内容加上id=“print”,例如:

print>

测试:step1设置的锚点,step2 中的 id 为 print 的内容会滚动到页面顶端(可观察滚动条的距离),同时,页面的 url 末端中会出现 #print 的哈希值。

相关文章
|
5天前
|
JavaScript 前端开发 程序员
前端学习笔记——node.js
前端学习笔记——node.js
17 0
|
9天前
|
存储 前端开发 JavaScript
前端必备知识:闭包的概念、作用与应用
前端必备知识:闭包的概念、作用与应用
12 1
|
9天前
|
前端开发 小程序 Java
java基础:map遍历使用;java使用 Patten 和Matches 进行正则匹配;后端传到前端展示图片三种情况,并保存到手机
这篇文章介绍了Java中Map的遍历方法、使用Pattern和matches进行正则表达式匹配,以及后端向前端传输图片并保存到手机的三种情况。
11 1
|
16天前
|
JavaScript 前端开发 API
前端技术分享:Vue.js 动态路由与守卫
【10月更文挑战第1天】前端技术分享:Vue.js 动态路由与守卫
|
5天前
|
JavaScript 前端开发 应用服务中间件
Vue开发中,在实现单页面应用(SPA)前端路由时的hash模式和history模式的区别及详细介绍
Vue开发中,在实现单页面应用(SPA)前端路由时的hash模式和history模式的区别及详细介绍
13 0
|
5天前
|
前端开发 JavaScript 程序员
【从前端入门到全栈】Node.js 之核心概念
【从前端入门到全栈】Node.js 之核心概念
|
9天前
|
前端开发 JavaScript Shell
深入解析前端构建利器:webpack核心概念与基本功能全览
深入解析前端构建利器:webpack核心概念与基本功能全览—
13 0
|
10天前
|
前端开发 JavaScript Java
导出excel的两个方式:前端vue+XLSX 导出excel,vue+后端POI 导出excel,并进行分析、比较
这篇文章介绍了使用前端Vue框架结合XLSX库和后端结合Apache POI库导出Excel文件的两种方法,并对比分析了它们的优缺点。
145 0
|
10天前
|
前端开发 JavaScript 小程序
前端uni开发后端用PHP的圈子系统该 如何做源码?
圈子系统系统基于TP6+Uni-app框架开发;客户移动端采用uni-app开发,管理后台TH6开发。系统支持微信公众号端、微信小程序端、H5端、PC端多端账号同步,可快速打包生成APP
|
11天前
|
前端开发 Java 数据库
springBoot:template engine&自定义一个mvc&后端给前端传数据&增删改查 (三)
本文介绍了如何自定义一个 MVC 框架,包括后端向前端传递数据、前后端代理配置、实现增删改查功能以及分页查询。详细展示了代码示例,从配置文件到控制器、服务层和数据访问层的实现,帮助开发者快速理解和应用。