JavaScript 字符与Unicode 转换汉字转Unicode码

旧城等待， 2022-05-29 04:26 255阅读 0赞

Unicode 是计算机科学领域里的一项业界标准，JavaScript本身就是使用Unicode字符集编写的，  
有时候我们需要对一段文本或者一段内容进行重新排版编译的时候就需要将获取的值进行转码，  
做个随笔记录一下，

其实主要使用的就是JS的 charCodeAt() 方法 和 escape() 函数  
关于这两个可以点击以下网址了解详情：  
[http://www.w3school.com.cn/jsref/jsref\_charCodeAt.asp][http_www.w3school.com.cn_jsref_jsref_charCodeAt.asp]

[http://www.w3school.com.cn/jsref/jsref\_escape.asp][http_www.w3school.com.cn_jsref_jsref_escape.asp]

--------------------

代码：

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <style> #show1,#show2{ width:200px; height:100px; margin: 15px 0; border: 1px solid #aaf; } </style>
    </head>
    <body>
    
    
    
    <input id="input1" type="text">
    
    <button id="btn1">字符转Unicode</button>
    
    <div id="show1"></div>
    
    
    <input id="input2" type="text">
    
    <button id="btn2">Unicode转字符</button>
    
    <div id="show2"></div>
    
    
    <script> function $(id) { var value = document.getElementById(id); return value; } // 转为unicode 编码 charCodeAt() 方法可返回指定位置的字符的 Unicode 编码。返回值是 0 - 65535 之间的整数。 function toUnicode(str) { var res = []; for ( var i=0; i<str.length; i++ ) { res[i] = ( "00" + str.charCodeAt(i).toString(16) ).slice(-4); } return "\\u" + res.join("\\u"); } // unicode转字符 escape() 函数可对字符串进行编码 function toStr(str){ str = str.replace(/(\\u)(\w{1,4})/gi,function(v){ return (String.fromCharCode(parseInt((escape(v).replace(/(%5Cu)(\w{1,4})/g,"$2")),16))); }); str = str.replace(/(&#x)(\w{1,4});/gi,function(v){ return String.fromCharCode(parseInt(escape(v).replace(/(%26%23x)(\w{1,4})(%3B)/g,"$2"),16)); }); str = str.replace(/(&#)(\d{1,6});/gi,function(v){ return String.fromCharCode(parseInt(escape(v).replace(/(%26%23)(\d{1,6})(%3B)/g,"$2"))); }); return str; } $("btn1").onclick=function () { $("show1").innerHTML=toUnicode($("input1").value); }; $("btn2").onclick=function () { $("show2").innerHTML=toStr($("input2").value); } </script>
    
    </body>
    </html>

执行后效果图：  
![这里写图片描述][Image 1]

--------------------

另外再提供一个在线转码的网站：  
[http://tool.chinaz.com/tools/unicode.aspx][http_tool.chinaz.com_tools_unicode.aspx]

[http_www.w3school.com.cn_jsref_jsref_charCodeAt.asp]: http://www.w3school.com.cn/jsref/jsref_charCodeAt.asp
[http_www.w3school.com.cn_jsref_jsref_escape.asp]: http://www.w3school.com.cn/jsref/jsref_escape.asp
[Image 1]: 
[http_tool.chinaz.com_tools_unicode.aspx]: http://tool.chinaz.com/tools/unicode.aspx