javascript - 如何通过javascript从模板中获取元素？

Question

我不知道如何通过 javascript 从模板中获取 DOM 元素的好方法。

示例模板：

<script id = "template" type="text/template">
    <div>text1</div>
    <div>text2</div>
    <div>text3</div>
</script>

例如，我想用“text2”获取 div

我知道有一些方法，它们都是不好的：

1. 向所有元素添加“类”——它破坏了语义（为 CSS 创建的类）。在大型项目中，您必须为类使用很长的名称，这非常不方便。

2. 通过他的数字（索引）获取元素 - 添加新元素时，您必须在代码中重写旧数字。

Answer 1

我看到了几个选项：

1. 如果不想使用class，可以使用data-*属性。

2. 假设您加载模板一次，然后根据需要复制其内容，您可以将id值放在模板中的元素上，然后在克隆它们并将它们添加到文档时将其删除（因此您最终不会id在元素的多个副本，这将是无效的并且可能会适得其反）。

Answer 2

也许您还可以根据需要创建任意数量的模板。每个 div 一个。如果您需要一次获取每个 div，则必须为它们设置 id...当然，您也可以浏览脚本元素中的 dom 以找到您感兴趣的那个...

回家这有帮助

问候

咪咪