javascript - 如何向 HTML 添加数据供 JavaScript 使用

Question

我有一个动态创建的页面，其中包含重复的元素，如下所示:

<input type="file" name="file1">
<input type="file" name="file2">
<input type="file" name="file3">

我想向每个元素添加一些数据以便在 JavaScript 中使用。最初我使用了“备用”属性，这些属性虽然在输入标记上有效，但在文件类型输入标记上无效，例如，size。我现在已将其添加到类属性中，但必须使用 regex 才能再次将其取出。这两种方法似乎都不太令人满意，有更好的方法吗？

Answer 1

我经常看到通过以 data- 为前缀的属性添加数据，例如:

<input type="file" name="file1" data-filesize="871">

jQuery 甚至具有方便读取该信息的功能，例如这样:

var filesize = $('input[name="file1"]').data('filesize');

并且，要写入数据，可以使用 attr:

$('input[name="file1"]').attr("data-filesize", filesize );

另请参阅:HTML 5 data atributes