javascript - 如何在 JavaScript 中读取选定元素的值

Question

我有几个这样的图像：

    <img id="geqfader" frequency="100" src="img/fader.png" />
    <img id="geqfader" frequency="400" src="img/fader.png" />
    <img id="geqfader" frequency="1600" src="img/fader.png" />
    <img id="geqfader" frequency="6300" src="img/fader.png" />

当用户单击图像时，我想调用一个函数并传递以下值frequency：

  document.getElementById('geqfader').addEventListener('click', function() {
    showResult(hereIWantTheFrequencyValue, toneFrequency)
  });

如何将图像frequency值传递到showResult（在哪里hereIWantTheFrequencyValue）？

标签： javascripthtml

Answer 1

用 class 替换所有 id 并设置onclick="showValue(this)"为所有 img 标签，如下面的代码......

        <img class="geqfader" onclick="showValue(this)" frequency="100" src="img/fader.png" />
        <img class="geqfader" onclick="showValue(this)" frequency="400" src="img/fader.png" />
        <img class="geqfader" onclick="showValue(this)" frequency="1600" src="img/fader.png" />
        <img class="geqfader" onclick="showValue(this)" frequency="6300" src="img/fader.png" />


<script>

function showValue(img){
  alert(img.getAttribute('frequency'));
}

</script>