Question

如果我用day [2]，day [3]等指定它，使用addEventListener更改类'day'很容易。

我真的不想为每个代码编写所有代码，如果点击它，我怎么能抓住类的“订单号”天[？]“，所以我可以在changeDate（）中使用它。

当前代码的部分内容：

var day = document.getElementsByClassName("day");

day[2].addEventListener("click", changeDate);

function changeDate() {
  console.log("hit");
}

<li class="day">1</li>
<li class="day">2</li>
<li class="day">3</li>

Answer 1

在changeData()功能中，您可以访问this。这是关联的<li>（已点击），因此请使用this.innerHTML获取当天的数量。

Answer 2

获取所有类并循环遍历它们以添加侦听器，如下所示：

var days = document.getElementsByClassName('day');
for(var i = 0; i < days.length; i++){
    days[i].addEventListener('click', changeDate);
}

编辑：抱歉，错过了最后一行：您的更改日期功能可以包含以下内容：

function changeDate(){
     var day = this.textContent;
};

现在是单击元素内文本中的day变量。

Answer 3

您可以使用以下代码使用标准JavaScript来查找并将点击事件处理程序附加到所有.day HTML元素。

<body>
<li class="day">1</li>
<li class="day">2</li>
<li class="day">3</li>
...
</body>

<script>
var dayArray = [];

window.onload = function(){

  dayArray = document.getElementsByClassName("day");
  
  for (var i = 0; i < dayArray.length; i++) {
    dayArray[i].addEventListener('click', changeDate, false);
  }

};

function changeDate(evt){
   console.log(this); // Here 'this' refers to the clicked HTML element
}
</script>

希望这有帮助。

Answer 4

除了@fauxserious答案，你可以试试这个：

var days = document.getElementsByClassName('day');
for(var i = 0; i < days.length; i++){
    days[i].addEventListener('click', changeDate);
}

function changeDate(){
   console.log('Clicked day ' + this.innerHTML);
}

在javascript中捕获className数字

4 个答案: