如何在不传递任何参数的情况下获得JavaScript函数中HTML元素的ID ?

Question

如何在不传递任何参数的情况下获得JavaScript函数中HTML元素的ID ?

我有一个HTML元素:

<input type="text" id="exampleInput" value="0" onkeypress="exampleFunction()">

从JavaScript中，我想改变HTML元素的值。

function exampleFunction() {

}

是否有可能在不传递ID作为参数的情况下实现这一点?

Answer 1

您可以像这样将this传递给您的函数:

function exampleFunction(e) {
console.log(e); // element
console.log(e.id);  // id
e.value = 'new value';  // change value
}

<input type="text" id="exampleInput" value="0" onkeypress="exampleFunction(this)">

或者，更好的是，使用addEventListener代替:

document.getElementById('exampleInput').addEventListener('keypress', function (e) {
console.log(e.target);  // element
console.log(e.target.id);  // id
e.target.value = 'new value';  // change value
});

<input type="text" id="exampleInput" value="0">

Answer 2

可以将元素作为this传递给函数

function exampleFunction(element) {
console.log(element.value);
}

<input type="text" id="exampleInput" value="0" onkeypress="exampleFunction(this)">