| FazBrowse GitHub Viewer | Trending | | Home |
| Tools: [Download Repo ZIP] [Original HTTPS Page] |
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
@@ -113,6 +113,62 @@ window.location.reload(true); | |||
| 113 | 113 | ||
| 114 | 114 | `toString`方法返回整个 URL 字符串,相当于读取`Location.href`属性。 | |
| 115 | 115 | ||
| 116 | + ## URL 的编码和解码 | ||
| 117 | + | ||
| 118 | + 网页的 URL 只能包含合法的字符,这可以分成两类。 | ||
| 119 | + | ||
| 120 | + - URL 元字符:分号(`;`),逗号(','),斜杠(`/`),问号(`?`),冒号(`:`),at(`@`),`&`,等号(`=`),加号(`+`),美元符号(`$`),井号(`#`) | ||
| 121 | + - 语义字符:`a-z`,`A-Z`,`0-9`,连词号(`-`),下划线(`_`),点(`.`),感叹号(`!`),波浪线(`~`),星号(`*`),单引号(`\``),圆括号(`()`) | ||
| 122 | + | ||
| 123 | + 除了以上字符,其他字符出现在 URL 之中都必须转义,规则是根据操作系统的默认编码,将每个字节转为百分号(`%`)加上两个大写的十六进制字母。比如,UTF-8 的操作系统上,`http://www.example.com/q=春节`这个 URL 之中,汉字“春节”不是 URL 的合法字符,所以被浏览器自动转成`http://www.example.com/q=%E6%98%A5%E8%8A%82`。其中,“春”转成了`%E6%98%A5`,“节”转成了“%E8%8A%82”。这是因为“春”和”节“的 UTF-8 编码分别是`E6 98 A5`和`E8 8A 82`,将每个字节前面加上百分号,就构成了 URL 编码。 | ||
| 124 | + | ||
| 125 | + JavaScript 提供四个 URL 的编码/解码方法。 | ||
| 126 | + | ||
| 127 | + - `encodeURI()` | ||
| 128 | + - `encodeURIComponent()` | ||
| 129 | + - `decodeURI()` | ||
| 130 | + - `decodeURIComponent()` | ||
| 131 | + | ||
| 132 | + ### encodeURI() | ||
| 133 | + | ||
| 134 | + `encodeURI()`方法用于转码整个 URL。它的参数是一个字符串,代表整个 URL。它会将元字符和语义字符之外的字符,都进行转义。 | ||
| 135 | + | ||
| 136 | + ```javascript | ||
| 137 | + encodeURI('http://www.example.com/q=春节') | ||
| 138 | + // "http://www.example.com/q=%E6%98%A5%E8%8A%82" | ||
| 139 | + ``` | ||
| 140 | + | ||
| 141 | + ### encodeURIComponent() | ||
| 142 | + | ||
| 143 | + `encodeURIComponent()`方法用于转码 URL 的组成部分,会转码除了语义字符之外的所有字符,即元字符也会被转码。所以,它不能用于转码整个 URL。它接受一个参数,就是 URL 的片段。 | ||
| 144 | + | ||
| 145 | + ```javascript | ||
| 146 | + encodeURIComponent('春节') | ||
| 147 | + // "%E6%98%A5%E8%8A%82" | ||
| 148 | + encodeURIComponent('http://www.example.com/q=春节') | ||
| 149 | + // "http%3A%2F%2Fwww.example.com%2Fq%3D%E6%98%A5%E8%8A%82" | ||
| 150 | + ``` | ||
| 151 | + | ||
| 152 | + 上面代码中,`encodeURIComponent()`会连 URL 元字符一起转义,所以如果转码整个 URL 就会出错。 | ||
| 153 | + | ||
| 154 | + ### decodeURI() | ||
| 155 | + | ||
| 156 | + `decodeURI()`方法用于整个 URL 的解码。它是`encodeURI()`方法的逆运算。它接受一个参数,就是转码后的 URL。 | ||
| 157 | + | ||
| 158 | + ```javascript | ||
| 159 | + decodeURI('http://www.example.com/q=%E6%98%A5%E8%8A%82') | ||
| 160 | + // "http://www.example.com/q=春节" | ||
| 161 | + ``` | ||
| 162 | + | ||
| 163 | + ### decodeURIComponent() | ||
| 164 | + | ||
| 165 | + `decodeURIComponent()`用于URL 片段的解码。它是`encodeURIComponent()`方法的逆运算。它接受一个参数,就是转码后的 URL 片段。 | ||
| 166 | + | ||
| 167 | + ```javascript | ||
| 168 | + decodeURIComponent('%E6%98%A5%E8%8A%82') | ||
| 169 | + // "春节" | ||
| 170 | + ``` | ||
| 171 | + | ||
| 116 | 172 | ## URL 对象 | |
| 117 | 173 | ||
| 118 | 174 | `URL`对象是浏览器的原生对象,可以用来构造、解析和编码 URL。一般情况下,通过`window.URL`可以拿到这个对象。 | |
| Back | FazBrowse Home | New Git URL |
0 commit comments