Question

我有一个大约有两打单元格的表，每个单元格包含一些文本。我想在单击时复制一个单元格的文本。
我的<td>元素没有ID。

我有这个js代码，可以让我向所有这些事件放置onClick()事件，并且它们的确提示“ Hello”消息：

var x = document.getElementsByTagName("td");
for (var i = 0; i < x.length; i++) {
    x[i].addEventListener("click", function() {
        alert("hello");
    });
}

如何从EventListener的函数中访问文本元素？

Answer 1

您可以使用 Event.target 并获取其innerText。

Event.target ：是发生事件的元素。

var x = document.getElementsByTagName("td");
for (var i = 0; i < x.length; i++) {
    x[i].addEventListener("click", function(e) {
        alert(e.target.innerText);
    });
}

Answer 2

您可以使用this关键字引用当前单击的 td 。然后只需访问this.textContent之类的innerText或textContent属性：

x[i].addEventListener("click", function() {
    alert(this.textContent);
});

演示：

var x = document.getElementsByTagName("td");
for (var i = 0; i < x.length; i++) {
    x[i].addEventListener("click", function() {
        alert(this.textContent);
    });
}

table, th, td {
  border: 1px solid black;
}

<table style="width:100%">
  <tr>
    <th>Firstname</th>
    <th>Lastname</th> 
    <th>Age</th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
  <tr>
    <td>John</td>
    <td>Doe</td>
    <td>80</td>
  </tr>
</table>

Answer 3

如果您使用的是jquery，则可以这样操作： table1是表的类名

$(".table1 td").on("click", function(){
        var thisCell = $(this).html();
            alert(thisCell);
    });

在EventListener函数中访问HTML元素的文本

3 个答案: