数据URI的特征
甲数据-URI与MIME类型
text/html必须是在其中一种格式：
data:text/html,<HTML HERE>data:text/html;charset=UTF-8,<HTML HERE>
不需要base-64编码。如果您的代码包含非ASCII字符，例如
éé，
charset=UTF-8则必须添加。
必须转义以下字符：
#
-Firefox和Opera将这个字符解释为哈希标记（如所示location.hash
）。%
-此字符用于转义字符。转义此字符以确保没有副作用发生。
此外，如果要将代码嵌入锚标记中，则还应转义以下字符：
" and/or '
-用引号标记属性的值。&
-与符号用于标记HTML实体。<
并且>
也 没有 进行转义 一个HTML属性中 。但是，如果您要将链接嵌入HTML，则也应将其转义（%3C and %3E
）
Javascript实现
如果您不介意data-URI的大小，最简单的方法是使用
enpreURIComponent
var html = document.getElementById("html").innerHTML;var dataURI = 'data:text/html,' + enpreURIComponent(html);如果大小很重要，则最好去除所有连续的空格（除非HTML包含
<pre>element/style，否则可以安全地做到这一点）。然后，仅替换有效字符：
var html = document.getElementById("html").innerHTML;html = html.replace(/s{2,}/g, '') // <-- Replace all consecutive spaces, 2+.replace(/%/g, '%25') // <-- Escape %.replace(/&/g, '%26') // <-- Escape &.replace(/#/g, '%23') // <-- Escape #.replace(/"/g, '%22') // <-- Escape ".replace(/'/g, '%27'); // <-- Escape ' (to be 100% safe)var dataURI = 'data:text/html;charset=UTF-8,' + html;
