我需要对以下字符进行URL编码.

Key Encoding
Space %20
and (literal word) %26

为此,我想出了以下代码.(我需要使用var,因为我的目标是较旧的浏览器.)

var word = "Windows and Mac"; // This can be anything

word = word.split(" ").join("%20");
word = word.split("and").join("%26");

然而,这段代码有一些问题.

  • 这不是最好的解决方案,很可能还有更好的解决方案.
  • and是区分大小写的(这意味着我不能输入"AND"、"aNd"等).

有没有其他方法来满足这些要求?它还需要在较旧的浏览器(如IE)上运行.

推荐答案

有几种方法可以实现这一点.


1. Use 100

第一种解决方案是使用string原语上的replace()函数.

您可以使用更简单的replace()函数,而不是再次使用不同的字符拆分和连接字符串.

此外,该功能在Internet Explorer 5.5及更高版本中工作,这意味着它满足要求!

要使用它,只需使用下面的代码.

var word = "Windows and Mac";

word = word.replace(/\s/g, "%20");
word = word.replace(/and/ig, "%26");

console.log(word);

让我们浏览一下代码.

  1. 使用的第一个replace()函数是将所有空格(由\s表示)替换为%20.第一个参数使用RegExp全局替换所有出现的情况(在RegExp末尾用g表示).JavaScript中有一个更新的方法叫做replaceAll(),但不幸的是,它是在ES6之后出现的!
  2. 第二个replace()个是获得所有and个事件,并在全局替换为%26个.然而,RegExp中还有另一个标志(i标志),这意味着它不区分大小写.这意味着它将适用于ANDaNd等单词.

2. Use 100

第二个更好的解决方案是使用encodeURIComponent()函数.

根据MDN Web Docs:

102函数通过将某些字符的每个实例替换为代表该字符UTF-8编码的一个、两个、三个或四个转义序列(对于由两个"代理"字符组成的字符,只有四个转义序列)来对URI进行编码.

基本上,它会将所有特殊字符编码为其URL编码字符(例如,空格将为%20).

此外,与replace()一样,Internet Explorer 5.5及更高版本也支持此功能.

要使用它,您需要使用下面的代码.

var word = "Windows and Mac";

word = encodeURIComponent(word);
word = word.replace(/and/ig, "%26");

console.log(word);

让我们看一下代码.

  1. 如前所述,encodeURIComponent()行将把任何特殊字符编码为URL编码.
  2. 我们仍然必须保持replace()函数不变,因为encodeURIComponent()只编码字符,而不是单词.阅读第一个解决方案,了解这行代码如何工作的更多信息.

还有,the order of the code is important!例如,如果我们将replace()放在encodeURIComponent()函数之前,它将对%进行编码,这将导致一些奇怪的结果(没有错误).你可以在下面自己试试!

var word = "Windows and Mac";

word = word.replace(/and/ig, "%26");
word = encodeURIComponent(word);

console.log(word);

你可以看到%被编码成%25,这会导致一些奇怪的结果!


总之,有两种解决方案都适用于Internet Explorer 5.5及更高版本.这些解决方案也满足您的要求.

Javascript相关问答推荐

使用JavaScript单击上一个或下一个特定按钮创建卡滑动器以滑动单个卡

Cypress -使用commands.js将数据测试id串在一起失败,但在将它们串在一起时不使用命令有效

IMDB使用 puppeteer 加载更多按钮(nodejs)

模块与独立组件

了解Node.js中的EventEums和浏览器中的addEventEums之间的关系

jQuery提交按钮重新加载页面,即使在WordPress中使用preventDefault()

如何修复我的js构建表每当我添加一个额外的列作为它的第一列?

WebRTC关闭navigator. getUserMedia正确

构造HTML表单以使用表单数据创建对象数组

简单的PayPal按钮集成导致404错误

如何将react—flanet map添加到remixjs应用程序

编辑文本无响应.onClick(扩展脚本)

在Matter.js中添加从点A到另一个约束的约束

使用js构造一个html<;ath&>元素并不能使其正确呈现

为什么这个.add.group({})在教程中运行得很好,但在我的游戏中就不行了?

使用带有HostBinding的Angular 信号来更新样式?

自定义图表工具提示以仅显示Y值

基于产品ID更新条带产品图像的JavaScript命中错误

在不扭曲纹理的情况下在顶点着色器中旋转UV

输入数据覆盖JSON文件