html 代码：
复制代码代码如下:
<! doctype html>
<html>
<head>
<title> ชื่อเรื่องหน้า </title>
<style type = "text/css">
*{font-family: consolas; รูปแบบฟอนต์: italic}
.ResponseBox {Width: 900px; มาร์จิ้น: 10px auto; padding: 10px; border: 2px solid #366; Border-Radius: 10px 0 10px 0; TEXT-ALIGING: CENTER}
.ResponseBox อินพุต,. responseBox Button {font-size: 30px; margin: 5px; padding: 5px;}
.SPANSUPER {แนวตั้ง-แนว: super; font-size: 14px}
.Spanbottom {แนวตั้ง-แนว: ข้อความด้านล่าง;
#showbox {Width: 900px; ความสูง: 430px; ชายแดน: 5px Solid #663; Border-Radius: 0 20px 0 20px; มาร์จิ้น: 10px auto; padding: 8px; Font-size: 20px}
</style>
</head>
<body>
<div>
<H1> JavaScript BASE64 ENCODE & DECODE <SPAN> [email protected] </span> <pan> 2014-12-27 17:44 </span> </h1>
<input type = "text" id = "input">
<อินพุต type = "ช่องทำเครื่องหมาย" id = "ช่องทำเครื่องหมาย" checked = "ตรวจสอบ"> base64 </input>
<button id = "btn"> แปลงเสร็จแล้ว! </button>
</div>
<div id = "showbox"> </div>
</body>
<script type = "text/javascript">
/*JavaScript 知识：
*函数： window.atob () window.btoa () unescape () escape () encodeuricomponent () decodeuricomponent ()
*正则表达式清除首位空格： _string.replace (/(^/s*) | (/s*$)/g, "");
-
*Covertbase64orstring 自执行函数
*inputId 输入框 id
*checkboxid 选择框 id
*btnid 按钮 id
*showid html 显示容器 id， 这里是一个 div#showbox
-
(ฟังก์ชั่น covertbase64orstring (inputId, checkboxid, btnid, showid) {
ช่องทำเครื่องหมาย var = document.getElementById (checkboxId); // html dom selectbox
var chkvalue = copbox.getAttribute ("ตรวจสอบ"); // html dom เลือก checkedValue
var btn = document.getElementById (btnid); // html DOM SELECT ID ID
var isbase64; // base64ToString หรือ stringtobase64 bool
var returnval = null; // สตริงแปลง
chkvalue == "ตรวจสอบ"? isBase64 = true: isBase64 = false; // 判断ตรวจสอบ按钮初始化状态 isbase64
Cuptbox.addeVentListener ("คลิก", ฟังก์ชั่น (e) {// ช่องทำเครื่องหมาย点击事件注册点击事件注册
var _ckvak = ช่องทำเครื่องหมาย GetAttribute ("ตรวจสอบ"); // 点击事件发生时， 改变ตรวจสอบ状态， 赋值 isbase64
if (_ckvak == "ตรวจสอบ") {
Cuptbox.setAttribute ("ตรวจสอบ", null);
ISBASE64 = FALSE;
} อื่น {
ช่องทำเครื่องหมาย SetAttribute ("ตรวจสอบ", "ตรวจสอบ");
isBase64 = true;
-
}, จริง);
btn.addeventListener ("คลิก" ฟังก์ชัน (e) {// ปุ่ม点击事件注册
var _show = document.getElementById (showId); // html dom เลือก ID showbox id
var _inputValue = document.getElementById (inputId) .Value; // 文本框取值
//_inputValue=_inputValue.replace(/(^/S*)|(/S*$)/g, ""); // 正则表达式去除首位空格， 似乎 btoa， abob 已经做了这些工作
var _showLength = _show.childnodes.length; // 遍历 Showbox， 清除 Showbox 内容
ในขณะที่ (_showLength> 0) {
_show.removeChild (_show.childnodes [_showLength - 1]);
_showlength--;
-
if (isBase64) {// string to base64， 支持中文编码， Unsescape， encodeuricomponent
returnVal = window.btoa (Unsescape (encodeuricomponent (_inputValue)));
} else {// base64 ถึงสตริง
returnVal = decodeuricomponent (Escape (window.atob (_inputValue)));
-
_show.AppendChild (document.createtextNode (returnVal)); // เพิ่มบริบทลงใน Showbox
}, จริง);
}) ("อินพุต", "ช่องทำเครื่องหมาย", "btn", "showbox");
// covertbase64orstring ("อินพุต", "ช่องทำเครื่องหมาย", "btn", "showbox");
</script>
</html>
效果：
推荐一个 JavaScript ide 比 Aptana 还好用。komodo ide （免费版： Komodo แก้ไข， 基本功能一样））， 智能感知，， 还支持 perl， Python， Ruby， Nodejs 语法等。