Javascript为我们提供了一个简单的方法来实现字符串的Base64编码和解码,分别是window.btoa()函数和window.atob()函数。

1   var encodedStr = window.btoa(“Hello world”); //字符串编码
2 var decodedStr = window.atob(encodedStr); //字符串解码

  

看下面的实例代码:

 <!DOCTYPE html>
<html>
<head>
<title>Javascript中Base64编码解码的使用实例 :: http://www.uncletoo.com</title>
<style>
#result{
height: 200px;
width: 500px;
overflow-y: auto;
border: #ccc dotted 1px;
}
</style>
</head>
<body>
结果:
<div id="result"> </div>
<table>
<tr><td>输入要编码的字符串: </td><td><input type='text' id='estr' value=''></td><td> <button onclick="encodeStr()">编码</button></td></tr>
<tr><td>输入要解码的字符串: </td><td><textarea id="dstr"></textarea></td><td> <button onclick="decodeStr()">解码</button></td></tr>
</table>
<script>
function encodeStr()
{ // 字符串编码
var str_val = document.getElementById("estr").value;
if (str_val === '')
{
alert("Please Enter string to encode");
} else {
var enc = window.btoa(str_val);
document.getElementById("result").innerHTML = enc;
}
}
function decodeStr()
{ // 字符串解码
var str_val = document.getElementById("dstr").value;
if (str_val === '')
{
alert("Please Enter string to Decode");
} else {
var dec = window.atob(str_val);
document.getElementById("result").innerHTML = dec;
}
}
</script>
</body>
</html>

Javascript中Base64编码解码的使用实例的更多相关文章

  1. JavaScript中的编码解码

    1.URI 统一资源标识符(URI)是一个用于标识某一互联网资源名称的字符串.,该种标识允许用户对任何(包括本地和互联网)的资源通过特定的协议进行交互操作.Web上可用的每种资源 -HTML文档.图像 ...

  2. PHP和javascript中url编码解码详解

    在实际开发中,我们可能会遇到路径编码解码的问题,下面总结了一下: PHP中: 1.urlencode(编码),urldecode(解码) $a = urlencode('http://www.baid ...

  3. C#与JavaScript中URL编码解码问题(转)

    混乱的URI编码 JavaScript中编码有三种方法:escape.encodeURI.encodeURIComponent C#中编码主要方法:HttpUtility.UrlEncode.Serv ...

  4. c#中base64编码解码

    //编码: byte[] bytes = Encoding.Default.GetBytes("要转换的字符"); string str = Convert.ToBase64Str ...

  5. Javascript与C#编码解码

    (一) Javascript与C#编码解码的对应关系 http://www.jb51.net/article/44062.htm 这篇文章主要是对JS与C#编码解码进行了详细的介绍,需要的朋友可以过来 ...

  6. nodejs base64 编码解码

    普通字符串 编码解码: var b = new Buffer('JavaScript'); var s = b.toString('base64'); // SmF2YVNjcmlwdA== var ...

  7. 利用openssl进行BASE64编码解码、md5/sha1摘要、AES/DES3加密解密

    国内私募机构九鼎控股打造APP,来就送 20元现金领取地址:http://jdb.jiudingcapital.com/phone.html内部邀请码:C8E245J (不写邀请码,没有现金送)国内私 ...

  8. Atitit. 二进制数据ascii表示法,与base64编码解码api 设计标准化总结java php c#.net

    Atitit. 二进制数据ascii表示法,与base64编码解码api 设计标准化总结java php c#.net 1. Base64编码, 1 1.1. 子模式 urlsafe Or  url  ...

  9. Atitit. 二进制数据ascii表示法,与base64编码解码api 设计标准化总结java php c#.net

    Atitit. 二进制数据ascii表示法,与base64编码解码api 设计标准化总结java php c#.net 1. Base64编码,1 1.1. 子模式 urlsafe Or  url u ...

随机推荐

  1. JavaScript中数组slice和splice的对比小结

    前言 今天重温了一下Javascript,看到了数组的方法,其中有两个比较相似的方法——splice和splice,看着很像,就是多了一个p,但是用法却相当不一样. 在使用中,可以通过选择一个具有强语 ...

  2. python第四十课——构造函数

    1.动态给对象添加属性: 在对象创建完毕后,单独为其添加需要的属性:可以理解为:私人定制 [注意]: 添加的属性只有此对象能够使用,别的对象如果用了,直接报错; 2.构造函数/构造方法/构造器: 格式 ...

  3. 使用uploadify多文件上传,单个删除上传成功的图片

    总体思路:在用uploadify上传成功一张图片,用js生成相应的元素,放到指定的位置,并且加上删除的标志.在保存的时候,把是img的所有的值,放到对应到字段里. jsp: <tr> &l ...

  4. js_script

    使用 self.crawl 的 js_script 参数,在页面上执行一段脚本,实现[点击加载更多]的效果: def on_start(self): self.crawl('http://movie. ...

  5. Fiddler抓包调试前端脚本代码

    0.写在前面的话 之前看了阮一峰老师关于互联网协议入门的博客,受益匪浅,接着再去体会了下HTTP协议,就想着看实际网络访问中的那些HTTP请求头和响应是什么样的.Chrome的调试工具的Network ...

  6. Hadoop体系结构杂谈

    hadoop体系结构杂谈 今天跟一个朋友在讨论hadoop体系架构,从当下流行的Hadoop+HDFS+MapReduce+Hbase+Pig+Hive+Spark+Storm开始一直讲到HDFS的底 ...

  7. Eclipse安装Git插件(在线和离线)

    在线安装: help-->install new software-->add location就是安装的地址:http://download.eclipse.org/egit/updat ...

  8. MongoDB 安装及副本集简单操作

    安装MongoDB 3.4 # 查看现有yum源 [root@localhost ~]# ll /etc/yum.repos.d/ total 36 -rw-r--r--. 1 root root 1 ...

  9. R语言入门 :基本数据结构

    1.向量 向量是R语言中最基本的数据类型,在R语言中没有单独的变量. (1)  创建向量 R语言中可以用 = 或者 <- 来赋值. 向量名 <- 向量 或  向量名 = 向量 向量的创建方 ...

  10. c# Login UI with background picture animation

    准备4张图片 UI control: <Grid x:Class="Test1.MainBgAd" xmlns="http://schemas.microsoft. ...