使用js手写一个base64编码解码工具,需要使用的函数方法：
先讲解一下这几个函数的使用方法，上面的函数为两组，一组为btoa编码，atob解码。一组为转换acsii码 encodeURIComponent，还原decodeURIComponent。
en_btn.onclick = function(){
var encodeURL = encodeURIComponent(text1.value)
var bt = btoa(encodeURL)
text2.value = bt
}
de_btn.onclick = function(){
var decodeURL = decodeURIComponent(text2.value)
var bt = atob(decodeURL)
text1.value = bt
}
完整代码
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<style type="text/css">
textarea {
width: 100%;
height: 500px;
}
</style>
<body>
<div style="width: 80%;">
<div style="float: left;width: 50%"><textarea id="encode" placeholder="编码区域"></textarea></div>
<div style="float: left;width: 50%"><textarea id="decode" placeholder="解码区域"></textarea></div>
<div><button id="en_btn">编码</button> <button id="de_btn">解码</button> <button id="clear">清空</button></div>
</div>
<script type="text/javascript">
var text1 = document.getElementById('encode')
var text2 = document.getElementById('decode')
var en_btn = document.getElementById('en_btn')
var de_btn = document.getElementById('de_btn')
var clear = document.getElementById('clear')
en_btn.onclick = function(){
var encodeURL = encodeURIComponent(text1.value)
var bt = btoa(encodeURL)
text2.value = bt
}
// 解码
de_btn.onclick = function(){
var decodeURL = decodeURIComponent(text2.value)
var bt = atob(decodeURL)
text1.value = bt
}
// 清空
clear.onclick = function(){
text1.value = ''
text2.value = ''
}
</script>
</body>
</html>