Question

为什么这两行为this创建不同的值？

<div>
  <a href="#" id= "li2" onclick="alert(this)"> a link </a> 
</div>
<p id= "p2" onclick="alert(this)"> a paragraph </p>

第一个警告文件的URI，第二个警告“HTML段落元素”。换句话说，第二个上下文是DOM元素，但第一个是主要上下文。

我已经对此做了很多研究，其中一些有点过头了，所以如果有人知道答案，你能为我愚蠢吗？

Answer 1

在内联JavaScript事件中，this是触发事件的元素。这些都是onclick个事件，因此this是您点击的元素。

使用alert()时，会将其参数转换为字符串。将<a>元素对象转换为字符串时，将获得其href值。将<p>元素转换为字符串后，您只需[object HTMLParagraphElement]，因为它没有自定义toString。

Revalent docs：https://developer.mozilla.org/en-US/docs/Web/API/URLUtils/toString

Answer 2

对于onclick事件，this变量绑定到被单击的DOM元素。当您在javascript中调用alert变量时，它实际上会调用toString()。在锚标记上调用toString()时，实际返回href属性。在段落标记上调用时，它没有内置的toString()方法，并且使用默认方法（只打印[object objectName]。

Answer 3

问题是HTMLAnchorElement从HTMLElement继承方法（自然地）以及URLUtils接口的实现methods。后者又使用方法toString返回当前的href属性。

当你alert任何东西时，它会将其争论转换为字符串类型，例如调用参数的toString方法。因此，你看到的行为。

HTMLParagraphElement（<p>）没有此属性，因此toString只返回默认字符串[object HTMLParagraphElement]。

在这个例子中，“this”的上下文是什么？

3 个答案: