Question

此代码显示[object HTMLLIElement]而不是实际的点击元素。当我console.log this变量时，它会向我提供我想要在页面中显示的元素，但在页面本身中显示[object HTMLLIElement]

var mainView = {
  liDis: function() {
    var liList = oct.catsList().getElementsByTagName('li');
    for (var i = 0; i < liList.length; i++) {
      liList[i].addEventListener('click', function() {
        console.log(this);
        oct.catsDisplay().innerHTML = this.value;
      });
    }
  }
}

Answer 1

如果你想获得事件的元素发起者，那么你应该使用event.target属性：

  liList[i].addEventListener('click', function(event) {
    console.log(event.target);
    oct.catsDisplay().innerHTML = event.target.value;
  });

因此，如果您在<li>元素中有按钮并点击它，您将在event.target中获得该按钮。

Answer 2

我能够做到的唯一方法是使用jQuery：

liDis: function () { 
                 $(document).on('click', 'li', function (e) {
                     e.preventDefault();
                     score = 0;
                    var jjjj = $(this).html();
                    $( "#catsDisplay" ).html( jjjj + "<br><p id='score'>" + 0 + "</p>");
                 })
    }

在尝试向页面添加元素时继续获取[object HTMLLIElement]

2 个答案: