如何获取HTML标记的“data-file”属性的内容

Question

我试图弄清楚如何获取HTML标记的引用内容。

下面是我得到的HTML：

<div class="html5videoplayer" id="player1" data-files="aGV5IG1hbg=="></div>

我正在尝试获取data-files属性的内容。

主要问题是，我不知道如何获得特定属性的内容。我知道我可以使用getElementById()或getElementsByClassName()来识别整个类或id，但是获取特定属性对我来说是未知的。

如果你有线索的话，我会非常感激的。谢谢!

Answer 1

使用jQuery：

var dataFiles = $('#player1').attr("data-files");

没有jQuery：

var dataFiles = document.getElementById("player1").getAttribute("data-files");

这两个选项都应该在任何浏览器中工作，！

您可以在这个小屁孩尝试这两种方法。

Answer 2

在数据()中使用jQuery函数。

$('#player1').data('files');

简单的JS，

var data = document.getElementById('player1').dataset.files;

但是对于像IE8这样的老浏览器，您不能使用dataset获得它，

因此，您可以使用此工作方法(只有在不使用jQuery时才需要此操作，然后只需使用第一个建议)。

var data = document.getElementById('player1').getAttribute('data-files');

Answer 3

您可以使用数据集：

var files = document.querySelector('#player1').dataset.files;

data-*是来自html5的属性，可用于存储元素的特定/特定数据。如果元素上有多个data-*属性，那么它将返回一个带有所有键和值的对象。