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

我有一个约有两打单元格的表，每个单元格包含一些文本。 我想在单击单元格时复制它的文本。
我的<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的函数中访问文本元素？

您可以使用并获取其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);
    });
}

您可以使用关键字引用当前点击的td 。 然后只需像this.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>

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

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

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

问题描述

1楼

2楼

3楼