Question

我开始学习JavaScript，在一些教程中，我看到使用了document.getElementById（），并且在同一案例的一些教程中使用了＃34;这个＆＃34;从触发事件的控件传递的。也许有人可以解释为什么我更喜欢一种方式而不是另一种？非常感谢

Answer 1

指定为事件的函数将其this上下文作为事件所属的对象。换句话说，元素本身。

// you can get Element a number of ways including document.getElementById('idHere')
function someFunc(){
  this.style.color = 'blue';
}
Element.onclick = someFunc;

或

Element.addEventListener('click', someFunc);

或

Element.onclick = function(){
  this.style.color = 'blue';
}

或

function someFunc(context){
  context.style.color = 'blue';
}
Element.onclick = function(){
  someFunc(this);
  // more code here
  // could use document.getElementById('whatever') to get HTML Element with id='whatever'
}

Answer 2

您是指addEventListener上this MDN页面上的文档吗？请务必查看the value of this within the handler上的部分。前面的示例使用document.getElementById来查找任意元素。例如，您可以将单击处理程序附加到按钮（或任何其他元素），以便在单击时修改某些其他元素。在这种情况下，您实际上没有对生成click事件的对象执行任何操作。因此，在处理程序中，您将使用document.getElementById来修改所需的元素。

但是，在某些其他情况下，您希望修改元素本身。例如，您可能希望更改用户单击的元素的颜色，让他们知道其状态已更改（基本上是切换）。在这种情况下，您希望访问实际生成事件的元素，并且可以使用this来实现。这里this表示“我是生成此事件的HTML元素”。

在更一般的上下文中，this可以有不同的含义，它取决于用例。在事件处理程序的上下文中，this表示生成事件的元素。在其他情况下，例如在面向对象的JavaScript中，函数中的this可以引用该函数的父对象。 JavaScript足够灵活，函数可以具有作者决定的任何this值。在编写良好的代码中，this具有通常有意义的含义，通常是指某种“拥有”的上下文或对象。

为什么不传递“this”而不是在JavaScript中使用document.getElementById（）

2 个答案: