当前位置:首页 > JavaScript

js实现urlencode

2026-04-05 19:49:01JavaScript

URL编码的实现方法

在JavaScript中,URL编码可以通过内置的encodeURIComponent()encodeURI()函数实现。这两种方法有不同的使用场景和编码范围。

encodeURIComponent()方法

encodeURIComponent()会对所有非标准字符进行编码,包括保留字符(如?&=等)。适用于编码URI的组件部分(如查询参数)。

js实现urlencode

const originalString = "hello world?param=value";
const encodedString = encodeURIComponent(originalString);
// 输出: "hello%20world%3Fparam%3Dvalue"

encodeURI()方法

encodeURI()不会编码保留字符和特殊字符,适用于编码整个URI。主要用于编码完整的URL而非其中部分。

const url = "https://example.com/hello world?param=value";
const encodedUrl = encodeURI(url);
// 输出: "https://example.com/hello%20world?param=value"

手动实现URL编码

如果需要更细粒度的控制或特殊需求,可以手动实现URL编码函数:

js实现urlencode

function customUrlEncode(str) {
    return str.replace(/[^\w\-_.~]/g, function(c) {
        return '%' + c.charCodeAt(0).toString(16).toUpperCase();
    });
}

解码URL编码

对应的解码函数有decodeURIComponent()decodeURI()

const encoded = "hello%20world%3Fparam%3Dvalue";
const decoded = decodeURIComponent(encoded);
// 输出: "hello world?param=value"

注意事项

encodeURIComponent()encodeURI()编码范围更广,适用于参数值编码。encodeURI()会保留URL结构字符,适用于完整URL编码。

对于特殊字符集或特定需求,可能需要结合使用这两种方法或实现自定义编码逻辑。

标签: jsurlencode
分享给朋友:

相关文章

js实现图片轮播

js实现图片轮播

实现基础图片轮播 使用HTML、CSS和JavaScript创建一个简单的图片轮播。HTML部分定义轮播容器和图片,CSS设置样式和动画效果,JavaScript处理轮播逻辑。 <div cl…

js实现自举

js实现自举

实现 JavaScript 自举的方法 JavaScript 自举(Bootstrap)通常指通过 JavaScript 动态加载自身或依赖的脚本,实现运行时环境的初始化或扩展。以下是几种常见实现方式…

js画图实现

js画图实现

使用Canvas API绘制图形 Canvas是HTML5提供的绘图API,通过JavaScript操作Canvas元素可以绘制各种图形。以下是一个简单的示例: <canvas id="myC…

js实现交换

js实现交换

交换变量的方法 在JavaScript中,交换两个变量的值有多种方法。以下是常见的几种实现方式: 使用临时变量 通过引入一个临时变量来存储其中一个变量的值,实现交换: let a = 1; le…

js实现vue路由

js实现vue路由

Vue 路由的基本实现 在 Vue.js 中实现路由功能通常使用 Vue Router 库。Vue Router 是 Vue.js 官方的路由管理器,用于构建单页面应用(SPA)。 安装 Vue R…

js实现代码雨

js实现代码雨

实现代码雨效果 使用HTML5 Canvas和JavaScript可以轻松实现经典的代码雨效果。以下是完整的实现代码和说明: HTML结构 <!DOCTYPE html> <…