表演

今天（2020.06.12），我在浏览器Chrome 83.0、Safari 13.1和Firefox 77.0的macOS v10.13.6（High Sierra）上对所选解决方案进行了速度测试。这一结果对于大规模URL编码非常有用。

结论

encodeURI（B）似乎最快，但不建议用于URLescape（A）是一种快速的跨浏览器解决方案MDN推荐的解决方案F为中速解决方案D最慢

细节

对于解决方案A.BCDEF我进行了两次测试

对于短URL-50个字符-您可以在这里运行对于长URL-1M个字符-您可以在此处运行

函数A（url）{返回转义符（url）；}函数B（url）{返回encodeURI（url）；}函数C（url）{返回encodeURIComponent（url）；}函数D（url）{返回新的URLSearchParams（｛url｝）.toString（）；}函数E（url）{return encodeURIComponent（url）.replace（/[！'（）]/g，escape）.replace（/\*/g，“%2A”）；}函数F（url）{return encodeURIComponent（url）.replace（/[！'（）*]/g，函数（c）{return“%”+c.charCodeAt（0）.toString（16）；});}// ----------//测试// ----------var myUrl=“http://example.com/index.html?param=1&anotherParam=2";[A、B、C、D、E、F].forEach（f=>console.log（`$｛f.name｝？url=$｛f（myUrl）.replace（/^url=/，''）｝`））；此代码段仅显示所选解决方案的代码

Chrome的示例结果

encodeURIComponent（）是最好的方法。

var myOtherUrl = "http://example.com/index.html?url=" + encodeURIComponent(myUrl);

但是您应该记住，与PHP版本urlencode（）有一些小的不同，正如@CMS所提到的，它不会对每个字符进行编码。伙计们在http://phpjs.org/functions/urlencode/使JavaScript等效于phpencodes（）：

function urlencode(str) {
  str = (str + '').toString();

  // Tilde should be allowed unescaped in future versions of PHP (as reflected below), but if you want to reflect current
  // PHP behavior, you would need to add ".replace(/~/g, '%7E');" to the following.
  return encodeURIComponent(str)
    .replace('!', '%21')
    .replace('\'', '%27')
    .replace('(', '%28')
    .replace(')', '%29')
    .replace('*', '%2A')
    .replace('%20', '+');
}

现代解决方案（2021）

自从编写了其他答案后，就引入了URLSearchParams API。它可以这样使用：

const queryParams = { param1: 'value1', param2: 'value2' }
const queryString = new URLSearchParams(queryParams).toString()
// 'param1=value1&param2=value2'

它还编码非URL字符。

对于您的具体示例，您可以这样使用：

常量myUrl=“http://example.com/index.html?param=1&anotherParam=2";const myOtherUrl=新URL（“http://example.com/index.html");myOtherUrl.search=新URLSearchParams（｛url:myUrl｝）；console.log（myOtherUrl.toString（））；

这个解决方案也在这里和这里提到。

编码URL字符串

var url = $(location).attr('href'); // Get the current URL

// Or
var url = 'folder/index.html?param=#23dd&noob=yes'; // Or specify one

var encodedUrl = encodeURIComponent(url);
console.log(encodedUrl);
// Outputs folder%2Findex.html%3Fparam%3D%2323dd%26noob%3Dyes

有关详细信息，请转到jQuery编码/解码URL字符串。

不应直接使用encodeURIComponent（）。

看看RFC3986：统一资源标识符（URI）：通用语法

sub-delims=“！”/“$”/“&”/“'”/“（”/“）”/ "*" / "+" / "," / ";" / "="保留字符的目的是提供一组可与URI中的其他数据区分的分隔字符。

这些来自RFC3986中URI定义的保留字符不会被encodeURIComponent（）转义。

MDN Web文档：encodeURIComponent（）

为了更严格地遵守RFC 3986（保留！、'、（、）和*），即使这些字符没有正式的URI分隔用途，也可以安全地使用以下字符：

使用MDN Web Docs功能。。。

function fixedEncodeURIComponent(str) {
  return encodeURIComponent(str).replace(/[!'()*]/g, function(c) {
    return '%' + c.charCodeAt(0).toString(16);
  });
}

let name=`bbb`；params=“name=$｛name｝”；var myOtherUrl=`http://example.com/index.html?url=${encodeURIComponent（params）}`；console.log（myOtherUrl）；

现在在ES6中使用backtick来编码URL

试试这个-https://bbbootstrap.com/code/encode-url-javascript-26885283