如何查找元素属性的值

Question

这是一段代码

<span class="balance themecolor" data-balance="2800">

我正在寻找一种方法来提取数据平衡的价值并将其设置为变量x，但我完全不知道如何去做。我知道 .val（）的存在，但我不知道是否可以将它应用于此代码。我正在寻找一条长线解决方案。

Answer 1

如果你正在使用jQuery（正如你所提到的那样.val()）：

var x = $("[data-balance]").attr("data-balance");

或者如果你不是：

var x = document.querySelector("[data-balance]").getAttribute("data-balance");

在这两种情况下，[data-balance]都是元素的CSS选择器;根据需要调整。例如，对于该元素，并且假设没有其他任何类的元素，您可以使用.balance，.themecolor甚至.balance.themecolor。

jQuery会找到与选择器匹配的所有元素（如果这是一个问题，你可以改变它，通常不是），但是只给你第一个的属性值。

querySelector将停止使用第一个。如果你想要找到它们并获得一个列表，请使用querySelectorAll（然后将其编入索引以获取各个列表）。