正在加载...

HTML URL 编码

字符集（charset）决定 HTML 文件如何把字节变成字母。URL 编码（百分号编码 / percent-encoding）是另一个问题：字符如何在 URL 内部安全地传递——出现在链接、重定向以及表单查询数据里——而又不破坏 URL 自身的结构。空格、非 ASCII 字母以及保留符号，常常需要写成 % 加上十六进制的形式，好让浏览器与服务器对含义达成一致。

什么是 URL 编码

URL 有一些用来组织地址结构的保留字符：? 开始查询串，& 分隔成对参数，= 把名称接到值，# 开始片段标识。如果这些字符作为 数据 出现在某个值里面，就必须编码，以免被误当成结构本身。空格这类不安全字符也要编码，才能可靠传输。

直接回答

URL 编码会把一个字符替换成 % 加上两位十六进制数字。经典例子：空格变成 %20。许多浏览器和 HTML 表单在提交时会自动编码查询值。当你手写 href 里的查询串、调试一条坏掉的链接，或阅读满是百分号编码的地址栏时，你仍然需要理解这一概念。

常见百分号编码

📊 常见百分号编码

Character Encoded Note
space %20 在查询串中极为常见
# %23 否则 # 会开始一个片段
& %26 & 分隔查询参数对
= %3D = 分隔名称与值
? %3F ? 开始查询字符串
/ %2F 值内部的斜杠可能需要编码

链接中的已编码查询

对手写一条带空格的搜索查询，是最清晰的入门演示。把值里的空格编码掉；结构用的 ? 和 = 保持原样。

查询中含已编码空格的链接

html
HTML Code 
<p>
<a href="search.html?q=html%20links">Search for html links</a>
</p>

阅读示例

  • search.html 是路径；在你能控制文件名时，请保持路径文件名简单
  • ?q= 开始一个名为 q 的查询参数
  • html%20links 是值「html links」，其中空格被编码为 %20
  • 可见的链接文字可以保持人类可读；编码属于 URL 本身

优先使用干净文件名；编码的是值

把整页文件名里的空格全部编码，对谁都不方便。请优先用 my-page.html，而不是 my page.html。百分号编码主要用在查询值，以及你必须手工拼装的 URL 中的特殊字符上。

干净路径与已编码的查询值

html
HTML Code 
<!-- Prefer a clean path -->
<a href="my-page.html">My page</a>

<!-- Encode spaces inside query values when needed -->
<a href="results.html?topic=url%20encode">URL encode results</a>

表单与浏览器常常会帮忙

当用户以 method="get" 提交 HTML 表单时，浏览器通常会替你把字段值编码进查询串。这并不能免除你在阅读日志、分享链接或手写 href 时理解 %20 的需要。掌握这一模式，调试会更快。

与 HTML 实体不是一回事

在 HTML 文本里，&amp; 是与号字符的实体。在 URL 里，作为 数据 的与号可以写成 %26。不同的工具，不同的上下文。同样，文件字符集 UTF-8 关乎如何解码 .html 文件——它并不能替代 URL 内部的百分号编码。

URL 中的非 ASCII（初学者提示）

基本 ASCII 之外的字母，在真实地址里可能表现为更长的百分号序列。本课不必去背那些对照表。记住规则即可：当某个字符作为数据时不安全或属于保留字符，百分号编码就是 URL 携带它的方式。学习页面里，在你熟悉之前，演示查询请保持简单拉丁字母加上 %20。

在编辑器中练习

  1. 创建一条链接，其 href 包含类似 ?q=hello%20world 的查询。
  2. 打开该链接，观察地址栏。
  3. 在源码里把 %20 改成原始空格，重新加载，比较浏览器如何规范化或破坏该 URL。
  4. 把练习文件改名为使用连字符而不是空格，并相应更新链接。
  5. 写出一个若与号属于数据就会需要 %26 的查询值——然后确认你没有去编码参数之间的结构性 &。

容易犯的错误

  • 在代码里把原始空格粘进 URL，却不检查结果
  • 误把 https:// 方案或整段结构骨架都做百分号编码
  • 把 HTML 实体（&amp;）与 URL 编码（%26）混为一谈
  • 每个文件名都塞空格，指望编码能永远拯救导航
  • 编码本该作为 URL 语法留在各部分之间的结构性 ? / & / =

小结

  • URL 编码使用 % 加上两位十六进制数字（空格 → %20）
  • 保留字符与不安全字符在作为 数据 时需要编码
  • 优先使用简单文件名；手写时对查询值做编码
  • 表单与浏览器在提交时常常自动编码
  • 百分号编码与 HTML 实体或文件字符集不是同一项工作

🧠 测试您的知识

准备开始

测试您的知识

通过这个互动测验挑战自己，看看你对这个主题的理解程度如何

❓
7
问题
🎯
70%
及格要求
♾️
∞
时间
🔄
∞
尝试次数

📝 说明

  • 仔细阅读每个问题
  • 为每个问题选择最佳答案
  • 您可以随时重新参加测验
  • 您的进度将显示在顶部
主题 1 的 1
Html 教程