URL中"#" "?" "&"号的作用

2023-05-16

‘#’

10年9月,twitter改版。一个显著变化,就是URL加入了”#!”符号。比如,改版前的用户主页网址为http://twitter.com/username/改版后,就变成了http://twitter.com/#!/username。这是主流网站第一次将”#”大规模用于重要URL中。这表明井号(Hash)的作用正在被重新认识。本文根据HttpWatch的文章,整理与井号有关的所有重要知识点。

‘#’的涵义

‘#’代表网页中的一个位置。其右面的字符,就是该位置的标识符。比如,http://www.example.com/index.html#print就代表网页index.html的print位置。浏览器读取这个URL后,会自动将print位置滚动至可视区域。
  为网页位置指定标识符,有两个方法。一是使用锚点,比如<a name="print"></a>,二是使用id属性,比如<div id="print">

HTTP请求不包括‘#’

‘#’是用来指导浏览器动作的,对服务器端完全无用。所以,HTTP请求中不包括‘#’。比如,访问下面的网址,http://www.example.com/index.html#print,浏览器实际发出的请求是这样的:

GET /index.html HTTP/1.1
Host: www.example.com

‘#’后的字符

在第一个‘#’后面出现的任何字符,都会被浏览器解读为位置标识符。这意味着,这些字符都不会被发送到服务器端。
比如,下面URL的原意是指定一个颜色值:http://www.example.com/?color=#fff,但是,浏览器实际发出的请求是:

GET /?color= HTTP/1.1
Host: www.example.com

改变‘#’不触发网页重载

单单改变‘#’后的部分,浏览器只会滚动到相应位置,不会重新加载网页。
比如,从http://www.example.com/index.html#location1改成http://www.example.com/index.html#location2,浏览器不会重新向服务器请求index.html。

改变‘#’会改变浏览器的访问历史

每一次改变‘#’后的部分,都会在浏览器的访问历史中增加一个记录,使用”后退”按钮,就可以回到上一个位置。这对于ajax应用程序特别有用,可以用不同的#值,表示不同的访问状态,然后向用户给出可以访问某个状态的链接。值得注意的是,上述规则对IE 6和IE 7不成立,它们不会因为#的改变而增加历史记录。

window.location.hash读取‘#’值

window.location.hash这个属性可读可写。读取时,可以用来判断网页状态是否改变;写入时,则会在不重载网页的前提下,创造一条访问历史记录。

onhashchange事件

这是一个HTML 5新增的事件,当#值发生变化时,就会触发这个事件。IE8+、Firefox 3.6+、Chrome 5+、Safari 4.0+支持该事件。
  它的使用方法有三种:
1. window.onhashchange = func;
2. <body onhashchange="func();">
3. window.addEventListener(“hashchange”,func, false);
对于不支持onhashchange的浏览器,可以用setInterval监控location.hash的变化。

‘?’

连接作用:比如http://www.xxx.com/Show.asp?id=77&nameid=2905210001&page=1
清除缓存:比如
http://www.xxxxx.com/index.html
http://www.xxxxx.com/index.html?test123123

两个url打开的页面一样,但是后面这个有问号,说明不调用缓存的内容,而认为是一个新地址,重新读取。

‘&’

不同参数的间隔符

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

URL中"#" "?" "&"号的作用 的相关文章

  • 面试造飞机系列:看架构师如何设计微服务接口

    来源 后端技术学堂 责编 Carol 封图 CSDN下载于视觉中国 在微服务设计中 xff0c 服务间接口通信设计常见的有两种方式 xff1a RPC 和 REST xff0c 关于微服务和 RPC 的更多细节 xff0c 可以参考我上一篇
  • C++ 数组(vector)常用操作总结

    目录 1 vector对象的定义和初始化方式 2 vector 常用基础操作 3 使用迭代器的遍历 插入 删除操作 4 vector 元素的重排操作 xff08 排序 逆序等 xff09 5 vector 中找最值 6 改变vector大小
  • ROS 节点初始化步骤、topic/service创建及使用

    目录 1 节点初始化步骤 2 service 创建及使用 3 topic创建及使用 4 框架总结 这是一个总结复盘的记录 1 节点初始化步骤 在 mian 函数中使用 ros init 初始化节点 xff0c 注册节点名 xff0c 这里注
  • Docker+xrdp+understand

    创建容器 我使用的是Ubuntu18 04的镜像 xff0c 注意把3389端口映射出来 docker run it name understand p 3399 3389 ubuntu 18 04 安装xrdp协议 span class
  • 如何下载Amazon页面产品视频

    step1 右键 查看网页源码 step2 ctrl 43 f查找 MP4 step3 xff1a 复制相关URL
  • 高速信号参考GND平面和VCC平面,会带来不同的回路阻抗,影响信号质量

    1 1参考平面作用 参考平面的作用之一是就是给信号提供回流路径 xff0c 对于信号来说 xff0c 不管任何网络的铜平面都可以作为参考平面 选择GND作为参考平面与其他网络的区别在于 xff0c 使用其他网络提供回流路径时 xff0c 网
  • 如何理解防抖debounce和节流throttle

    本人通过阅读网络上防抖和节流多篇相关的文章 xff0c 并借鉴相关案例进行说明 防抖 防抖就像人眨眼睛一样 xff0c 不可能不停的眨 xff0c 每隔一定时间眨一下 xff0c 防止眼睛干涩 xff0c 如果不停眨眼 xff0c 别人以为
  • 1024快乐!浅谈scrollTop需要踩的坑

    开始之前 xff0c 需要分清楚scrollTo和scrollTop 坑one 1 设置浏览器scrollTop 最好通过用户操作设置滚动 xff0c 或者setTimeout延时滚动 span class token comment Ch
  • 如何写出高效的 Vue 代码

    开讲之前我先简单的自我介绍一下 xff0c 本人自喻 xff1a flitrue xff0c 工作三年有余 xff0c 在一家不知名的互联网企业担任前端架构师之职 技术选型问题 近几年前端发展快速 xff0c 很多同学抱怨学不动了 xff0
  • 深入了解Object.freeze()和Object.seal()

    目录 Object freeze Object seal 对比Object freeze 和Object seal 拓展Object preventExtensions Object freeze 官方MDN对Object freeze 的
  • gulp和webpack的区别

    基本区别 xff1a gulp可以进行js xff0c htm xff0c css xff0c img的压缩打包 xff0c 是自动化构建工具 xff0c 可以将多个js文件或是css压缩成一个文件 xff0c 并且可以压缩为一行 xff0
  • require和import的区别?exports和module.exports的区别?export和export default的区别?

    CommonJs模块是运行时加载 xff0c ES6模块是编译时输出接口 require是commonjs规范中导入模块的语法 xff1b import是ES6规范中导入模块的语法 xff1b require支持动态导入 xff1b imp
  • nodejs中的EventLoop

    span class token operator gt span timers span class token operator lt span 执行 span class token function setTimeout span
  • https加解密流程图

  • 算法题:两个有序数组合并(最优解)

    合并两个有序数组最优解 时间复杂度 O n 空间复杂度 O n span class token comment 正向 span span class token keyword var span span class token func
  • linux 查看设备挂载信息

    系统 uname a 查看内核 操作系统 CPU信息 head n 1 etc issue 查看操作系统版本 cat proc cpuinfo 查看CPU信息 hostname 查看计算机名 lspci tv 列出所有PCI设备 lsusb
  • 什么是高阶函数和纯函数?

    高阶函数是一个接收函数作为参数或将函数作为输出返回的函数 纯函数的三个条件 xff1a 给定输入 xff0c 无论什么时候调用 xff0c 无论调用多少次 xff0c 输出总是确定无疑的 xff1b 在函数内部不可以改变函数外部对象的状态
  • Pre-commit:如何使用 husky、lint-staged和prettier优化你的项目

    在软件开发过程中 xff0c 代码风格检查 xff08 Code Linting xff09 是保障代码规范和一致性的有效手段 过去 xff0c Lint 的工作一般在 Code Review 或者 CI 的时候进行 xff0c 但这样会导
  • 2020: Vue和React生命周期

    Vue 生命周期 vue2有9个生命周期钩子 vue3也有9个生命周期钩子 2 x和3 x钩子的对应关系 xff1a beforeCreate gt 使用 setup created gt 使用 setup beforeMount gt o
  • ESLint常用规范

    off or 0 关闭规则 warn or 1 将规则视为一个警告 xff08 不会影响退出码 xff09 error or 2 将规则视为一个错误 退出码为1 span class token string 34 no console 3

随机推荐

  • 重写audio元素样式

    span class token selector audio span span class token punctuation span span class token property display span span class
  • git clone --mirror -q git://github.com/adobe-webplatform/eve.git

    解决办法 xff1a git全局添加一个属性 git config global url 34 https 34 insteadOf git 然后 xff0c 重新npm install
  • 理解npm包管理机制

    推荐文章 https segmentfault com q 1010000004114972 ea 61 496109 https blog csdn net azl397985856 article details 103982369
  • 面试题:使用promise实现并发请求限制(最优解)

    问题 xff1a 有 8 个图片资源的 url xff0c 已经存储在数组 urls 中 xff0c 而且已经有一个函数 function loadImg xff0c 输入一个 url 链接 xff0c 返回一个 Promise xff0c
  • PHP关于VC11,VC9,VC6以及Thread Safe和Non Thread Safe版本选择的问题

    从PHP5 2 10版本开始 xff08 现在有PHP5 2 10和5 3两个版本 xff09 xff0c 有None Thread Safe与Thread Safe两种版本的可供选择 xff0c 这两种版本有何不同 xff0c 作为使用者
  • apache下载安装配置

    最近从apache官网上下载了apache最新版本的压缩包httpd 2 4 18 x64 vc11 r3 zip xff0c 解压以后用cmd命令安装了好长时间都没有安装上 xff0c 在网上找各种解决方法 xff0c 都不靠谱 xff0
  • ubuntun无法安装 libsdl2-dev

    sudo apt get install libsdl2 dev Reading package lists Done Building dependency tree Reading state information Done Some
  • PHPCrawler抓取酷狗精选集歌单

    一 PHPCrawler的介绍与安装 先了解一下什么是抓取 xff1f 抓取就是网络爬虫 xff0c 也就是人们常说的网络蜘蛛 xff08 spider xff09 是搜索引擎的一个重要组成部分 xff0c 按照一定的逻辑和算法抓取和下载互
  • 跨站脚本攻击XSS

    跨站脚本攻击 Cross Site Script为了区别于CSS简称为XSS 指的是恶意攻击者往Web页面里插入恶意html代码 xff0c 当用户浏览该页之时 xff0c 嵌入其中Web里面的html代码会被执行 xff0c 从而达到恶意
  • RedHat系统下安装yum

    一 前言 因为RedHat系统下的软件更新是RedHat公司的一项服务 xff0c 必须用钱买的rhel系统 xff0c 并且注册了RedHat的用户才能使用yum xff0c 要想免费使用yum xff0c 必须卸载原来的yum xff0
  • js实现图片放大镜效果

    一 HTML文件 lt DOCTYPE html PUBLIC 34 W3C DTD XHTML 1 0 Transitional EN 34 34 http www w3 org TR xhtml1 DTD xhtml1 transiti
  • PHP获取文件的修改时间、访问时间和inode 修改时间

    filemtime string filename 返回文件上次被修改的时间 xff0c 出错时返回 FALSE 时间以 Unix 时间戳的方式返回 xff0c 可用于 date 例如 xff1a a 61 filemtime 34 log
  • PHP设计模式之单例模式

    最近开始学习设计模式 xff0c 由于一开始没有系统的学习 xff0c 导致学的知识七零八落的 xff0c 得好好整理一下了 单例模式 xff08 职责模式 xff09 xff1a 简单的说 xff0c 一个对象 xff08 在学习设计模式
  • 创业资金来源

    创业资金的获得一般有以下几个途径 xff1a 一 自有资金 这个主要是自身的存款 xff0c 一般工作几年的人或多或少都有点存款 xff0c 这一部分的钱是自己创业的基本基金 二 股权融资 股权融资 xff0c 是指创业者或中小企业让出企业
  • Cannot modify header information解决办法

    如果在执行php程序时看到这条警告 Warning Cannot modify header information headers already sent by 可以尝试以下几种解决方法 Use exit statement 用exit
  • 中国距离VR市场成熟还要多久?

    VR xff08 Virtual Reality的缩写 xff0c 中文翻译 虚拟现实 xff09 概念早在80年代初就被提出来的 xff0c 其具体是指借助计算机及最新传感器技术创造的一种崭新的人机交互手段 中国VR产业仍在摸索阶段 亟缺
  • URL重写规则

    今天给大家详细讲解一下RewriteCond指令与RewriteRule 指令的格式 Rewirte主要的功能就是实现URL的跳转和隐藏真实地址 xff0c 基于Perl语言的正则表达式规范 帮助我们实现拟静态 xff0c 拟目录 xff0
  • 二值信号量与互斥锁区别

    互斥锁和二值信号量在使用上非常相似 xff0c 但是互斥锁解决了优先级翻转的问题 以军长 师长 团长为案例 xff0c 讲解mutex与signal区别 xff0c 以下是时序图 参考 xff1a https www cnblogs com
  • redisson-spring-boot-starter

    redisson spring boot starter spring boot 配置 spring redis redisson config classpath redisson beta yml 或者 spring redis red
  • URL中"#" "?" "&"号的作用

    10年9月 xff0c twitter改版 一个显著变化 xff0c 就是URL加入了 符号 比如 xff0c 改版前的用户主页网址为http twitter com username 改版后 xff0c 就变成了http twitter