获取价值数据 - 属性原生Javascript

时间:2017-04-27 09:17:14

标签: javascript

我使用原生js,我需要从data-atribute获取我点击的所有元素的值。

window.onload = function() {

    let btn = document.getElementsByClassName('btn');

    for( let i = 0; i < btn.length; i++ ) {
        btn[i].addEventListener( "click" , function(e) {
            let dataBtn = e.getAttribute('data-btn');
            console.log(dataBtn);
        });
    }

};

但我得到错误(e.getAttribute不是函数)

我可以在本地js中使用它吗?

1 个答案:

答案 0 :(得分:2)

您可以通过调用'data-btn'或致电this.getAttribute('data-btn')来访问事件处理函数中当前单击元素的btn[i].getAttribute('data-btn');属性。

代码:

&#13;
&#13;
let btn = document.getElementsByClassName('btn');

for (let i = 0, len = btn.length; i < len; i++) {
  btn[i].addEventListener('click' , function() {
    let dataBtn = this.getAttribute('data-btn');
    console.log(dataBtn);
  });
}
&#13;
<a class="btn btn-default" data-btn="1" href="#" role="button">Link</a>
<button class="btn btn-default" data-btn="2" type="submit">Button</button>
<input class="btn btn-default" data-btn="3" type="button" value="Input">
<input class="btn btn-default" data-btn="4" type="submit" value="Submit">
&#13;
&#13;
&#13;