IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> JavaScript知识库 -> javascript &#x&# |x% 与中文的编码转换 -> 正文阅读

[JavaScript知识库]javascript &#x&# |x% 与中文的编码转换

𣇉 是两个unicode “\uD84C\uDDC9”

1、js提供的函数

用console.log输出

1.1 unicode编码

escape("中文") => "%u4E2D%u6587"

	"中".charCodeAt(0).toString(16) =>"4e2d"

	"文".charCodeAt().toString(16) =>"6587"
	String.fromCharCode(0x4e2d) =>"中"


String.fromCharCode(55372,56777) =>"𣇉" =>escape("𣇉")=>"%uD84C%uDDC9" =>"\uD84C\uDDC9"
   用两个unicode表示一个汉字 “𣇉”

1.2 utf-8编码

encodeURI("中文") => "%E4%B8%AD%E6%96%87"

1.3 进制方法

Number("0xE4") => 228=>0xE4

Number(228).toString(16) => "e4"

escape("\x61") => "a"

    "a".charCodeAt(0) => 97

    "a".charCodeAt(0).toString(16) => "61"

1.4 编码方法

//escape是进行unicode编码
escape("&") => %26 
unescape("%26123") -> &123

escape("确")->"%u786E"
unescape(%u786E) ->//encodeURI(Component)是对地址编码以便兼容所有浏览器ascii模式
encodeURI方法不会对下列字符编码 ASCII字母 数字 ~!@#$&*()=:/,;?+'
encodeURIComponent方法不会对下列字符编码 ASCII字母 数字 ~!*()'


//适合url地址
//编码后地址可识别
encodeURI("https://blog.csdn.net/hvang1988?a =&")
	=>"https://blog.csdn.net/hvang1988?a%20=&";


//适合参数编码	
//因为编码后不影响地址
encodeURIComponent("https://blog.csdn.net/hvang1988?a =&")
	=>"https%3A%2F%2Fblog.csdn.net%2Fhvang1988%3Fa%20%3D%26"
 //举例如下:
    var a=encodeURI("a=b");
    // 编码后会影响地址解析
    console.log(a) //a=b  
    a=encodeURIComponent("a=b");
    //编码后不影响地址,所以适合对参数编码然后附加到地址中
    // https://blog.csdn.net/hvang1988?p=a%3Db  这种才是后台需要的
    console.log(a); //a%3Db

1.4 补充

&#后跟unicode 十进制
&#x 后跟的是unicode 十六进制
% 后跟16进制 比如escape("&") 为%26  而&的ascii为36

2、中文 和 &#x 互转

中文 在html标签中会自动编码为汉字,和 类似

2.1 中文 转 &#x

过程:

 中文=>escape("中文") => "%u4E2D%u6587"  =>

   把%u替换成 &#x即可 ,因为后边跟的都是十六进制=> "中文"

js实现:

function code(str) {
    var result = "";
    for (var i = 0; i < str.length; i++) {
        result += "&#x" + str.charCodeAt(i).toString(16)+";";
    }
    return result;
}

//测试
console.log(code("中文")); //&#x4e2d;&#x6587;

2.2 &#x 转中文

过程:

  &#x4E2D&#x6587 => &#x替换为%u =>

  %u4E2D%u6587 =>unescape("%u4E2D%u6587") =>中文

js实现:


3、中文和 &# 互转

使用 .charCodeAt可以获取unicode码

tip:&#55372;&#56777; 在html标签中会自动编码为汉字,和&nbsp;类似

在线互转(Unicode和ASCII):http://tool.chinaz.com/tools/unicode.aspx

3.1 中文转 &#

过程:

中文
=>找到unicode十进制再前缀&#即可
=>"&#"+"中".charCodeAt(0)+";"+"&#"+"文".charCodeAt(0) +";"
=>"&#20013;&#25991;"

js实现:

function code(str) {
    var result = "";
    for (var i = 0; i < str.length; i++) {
        result += "&#" + str.charCodeAt(i)+";";
    }
    return result;
}

//测试
console.log(code("中文")) //&#20013;&#25991;

3.2 &# 转 中文

过程:

&#20013;&#25991;
=> 去除unicode  [20013,25991]
=>把字节编码为字符集汉字(utf8)
=>中文

js实现:

function code(str) {
    var arry = str.match(/&#(\d+);/g);
    var result = "";
    for (var i = 0; i < arry.length; i++) {
        result += String.fromCharCode(arry[i].replace(/[&#;]/g, ''))
    }
    return result;
}
//测试
console.log(code(x)) //𣇉
//补充
String.fromCharCode(55372,56777) //𣇉
String.fromCharCode(55372,56777,20013,25991)// 𣇉中文

4 中文 和 \x 互转

encodeURI会进行utf8按字节编码,比如

encodeURI(“𣇉”) =>"%F0%A3%87%89" 和\x也是按字节 异曲同工。

4.1 中文 转 \x

过程:

encodeURI("中文") => "%E4%B8%AD%E6%96%87" => %替换为\x=> \xE4\xB8\xAD\xE6\x96\x87

补充:\x一般是其他程序产生,而不是js

js实现:

function code(str) {
    return encodeURI(str).replace(/%/g,"\\x");
}
var x="中文";
console.log(code(x)); //\xE4\xB8\xAD\xE6\x96\x87

4.2 \x 转 中文

过程:

 \xE4\xB8\xAD\xE6\x96\x87=>替换\x为% =>%E4%B8%AD%E6%96%87

		 =>decodeURI("%E4%B8%AD%E6%96%87") => 中文

js实现:

function code(str) {
    return decodeURI(str.replace(/\\x/g,"%"));
}
var x="\\xE4\\xB8\\xAD\\xE6\\x96\\x87";
console.log(code(x)); //中文

5、中文和unicode 互转

使用escape和unescape 进行unicode 转码

在线互转(中文和unicode):https://www.bejson.com/convert/unicode_chinese/

5.1 中文转unicode

过程 :

escape("中文") => "%u4E2D%u6587" =>替换%为\u即可=>"\u4E2D\u6587"

js实现:

function code(str) {
    var result="";
    for (var i = 0; i < str.length; i++) {
       var tmp="00" + str.charCodeAt(i).toString(16);
        result+="\\u"+tmp.slice(-4);
    }
    return result;
}

console.log(code("中文"));//\u4e2d\u6587

5.2 unicode转中文

过程 :

js中识别unicode
比如var a="\u4e2d\u6587" //a就是中文


"\\u4e2d\\u6587"
=>"%u4e2d%u6587"
=>unescape("%u4e2d%u6587")
=>中文

js实现:

function code2(str) {
    var b=str.replace(/\\/g,"%");
    console.log(b)
   return  unescape(b);
}


//测试
console.log(code2("\\u4e2d\\u6587"));
  JavaScript知识库 最新文章
ES6的相关知识点
react 函数式组件 & react其他一些总结
Vue基础超详细
前端JS也可以连点成线(Vue中运用 AntVG6)
Vue事件处理的基本使用
Vue后台项目的记录 (一)
前后端分离vue跨域,devServer配置proxy代理
TypeScript
初识vuex
vue项目安装包指令收集
上一篇文章      下一篇文章      查看所有文章
加:2021-08-29 08:59:40  更:2021-08-29 09:01:27 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年9日历 -2024/9/28 6:27:26-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码