如何在javascript中将随机字符串转换为唯一且ID友好的字符串

问题描述

给定javasript中的许多随机字符串,例如:

str1 = "1%&2xy 232=2"
str2 = "2$$2xy 232=2"
str3 = "ls dlsdl fs§$02"

所以字符串可能包含空格、数字、$、%、&、各种字符。

现在假设我想生成 html 元素,每个字符串一个元素:

<div id="???">str1</div>
<div id="???">str2</div>
<div id="???">str3</div>

如何为每个字符串本身创建的每个元素添加 id?删除不需要的字符将不起作用,因为不同的字符串可能会导致相同的 ID。我还想避免使用 $('div:contains(str)'),因为我正在寻找一种方法生成唯一且可重现的 ID。

我考虑将每个字符串转换为十六进制并在前面加上“a”,因为 ID 不能以数字开头。

但是有人知道更好的方法吗?

解决方法

如果您只能使用 id,请使用 btoa 转换为 base64:

// Prefix with a letter since it is possible for a base64 string to start with a number.
element.id = "i" + btoa(str1); // "1%&2xy 232=2" -> "MSUmMnh5IDIzMj0y"

如果这不是必需的,请改用 data 属性:

<div data-str="1%&2xy 232=2">str1</div>
<div data-str="2$$2xy 232=2">str2</div>