JS:變數儲存HTML標籤的離譜方式
阿新 • • 發佈:2021-06-28
專案中有一處原始碼需要用變數儲存html標籤,包含類名和其他一些屬性,再動態地將其渲染到頁面上。
看下普通的儲存方式:
initHtml: function () { var me = this; // var _html = ['<div class="mykb-box" id="mykeyboard' + me.count + '">', '<ul class="num-key clearfix">', '<li class="num">1</li>', '<li class="num">2</li>', '<li class="num">3</li>', '<li class="func exit">退出</li>', '<li class="num">4</li>', '<li class="num">5</li>', '<li class="num">6</li>', '<li class="func del">退格</li>', '<li class="num">7</li>', '<li class="num">8</li>', '<li class="num">9</li>', '<li class="func clearall">清除</li>', '<li class="num">0</li>', '<li class="num">.</li>', '<li class="func sure">確定</li>', '</ul>', '</div>', ].join("");// $("body").append(_html); // me.setPosition(); }
也許是用了某個外掛對程式碼進行了壓縮,最終的.min.js檔案時用這樣的方式儲存的。
initHtml: function() { var a = ['\x3cdiv class\x3d"mykb-box" id\x3d"mykeyboard' + this.count + '"\x3e', '\x3cul class\x3d"num-key clearfix"\x3e\x3cli class\x3d"num"\x3e1\x3c/li\x3e\x3cli class\x3d"num"\x3e2\x3c/li\x3e\x3cli class\x3d"num"\x3e3\x3c/li\x3e\x3cli class\x3d"func exit"\x3e\u9000\u51fa\x3c/li\x3e\x3cli class\x3d"num"\x3e4\x3c/li\x3e\x3cli class\x3d"num"\x3e5\x3c/li\x3e\x3cli class\x3d"num"\x3e6\x3c/li\x3e\x3cli class\x3d"func del"\x3e\u9000\u683c\x3c/li\x3e\x3cli class\x3d"num"\x3e7\x3c/li\x3e\x3cli class\x3d"num"\x3e8\x3c/li\x3e\x3cli class\x3d"num"\x3e9\x3c/li\x3e\x3cli class\x3d"func clearall"\x3e\u6e05\u9664\x3c/li\x3e\x3cli class\x3d"num"\x3e0\x3c/li\x3e\x3cli class\x3d"num"\x3eX\x3c/li\x3e\x3cli class\x3d"func sure"\x3e\u786e\u5b9a\x3c/li\x3e\x3c/ul\x3e\x3c/div\x3e'].join(""); b("body").append(a); this.setPosition() }
' \x ' 是16進位制的轉義字元,十六進位制中,數字是按'0 1 2 3 4 5 6 7 8 9 a b c d e f 11 12'排列的,f表示十進位制的16,11表示十進位制的17。
由此可知 ' 3c ' 中的 3 代表 十位數,值是 3*16, c 是12 ,總60,在ASCII 編碼表中,60代表' < ' ,61代表' = ' ,62代表' > ' ,在編碼套在a變數
var a = ['<div class="mykb-box" id="mykeyboard"' + this.count + '">'………………
不得不服,就離譜