2

在点击链接部分中的链接之前，我正在尝试在 JavaScript 中做一些事情href：

<a href="open.this.page" onclick="doStuff(this);return false; title="follow me">

问题是thisindoSuff(this)指的是什么？我原以为必须从中href取出锚的一部分，但是当检查它时，它看起来像它href，没有别的。

function doSutff(my_arg) {
   alert (my_arg);
   // do stuff
   // follow the href in the link
}

在上面的警报中，我得到的正是hrefas "http://my.domain/open.this.page"。

这是预期的还是我在一个浏览器中得到它，但可能不是在另一个浏览器中？

如果这是正常行为，那么如何获得例如锚的一部分rel或一部分？title只有 DOM？

4

3 回答 3

4

在这种情况下this指的是 DOM 节点。

于 2012-12-12T15:21:43.353 回答
3

this在任何事件（onclick 或其他）的上下文中，指的是触发事件的 DOM 元素。

在您的情况下，它是锚标签本身。

于 2012-12-12T15:21:57.823 回答
3

“在上述警报中，我得到的完全href一样"http://my.domain/open.this.page"。

这是预期的还是我在一个浏览器中得到它，但可能不是在另一个浏览器中？”

这是意料之中的。您收到警报的原因是这就是元素"http://my.domain/open.this.page"的默认.toString()值。<a>

这是一个不寻常的案例。其他元素不显示属性作为.toString()表示。

如果您想实际使用href，您需要这样做this.toString()，或见下文...

“...例如，如何获得锚的 REL 或 TITLE 部分？”

要获取其他属性或属性，您只需按照通常的方式进行即可。

要获取属性，您可以执行以下操作：

onclick="doStuff(this.getAttribute('title')); return false;"

大多数标准属性直接映射到节点上的属性，因此您也可以这样做：

onclick="doStuff(this.title); return false;"

或者因为你在一个内联处理程序中，你实际上可以这样做：

onclick="doStuff(title); return false;"

最后一个起作用的原因是从属性分配的处理程序具有包含元素本身的唯一范围链。这意味着元素上的属性实际上显示为变量。

请注意，这不适用于任何其他类型的事件处理程序。

关于this，它指的是处理程序绑定到的元素。

属性发生的事情是它基本上成为分配给onclick属性的函数的主体。

所以你最终会得到这样的结果：

elem.onclick = function(event) {
    doStuff(this);return false; // Your onclick attribute value
}

所以你可以看到这this实际上只是在分配给属性的事件处理程序中找到的正常值。

另请注意，event定义了一个参数。这意味着您可以像这样更改属性：

onclick="doStuff(this, event);return false;"

...它将传递该参数，因为现在您的函数如下所示：

elem.onclick = function(event) {
    doStuff(this, event);return false; // Your onclick attribute value
}

所以你可以看到你的字符串实际上是在引用event函数的普通参数。

这也适用于较旧的 IE。在 IE 中，event参数不会被定义，所以它会选择全局event对象。

      // ---------------v----no parameter
elem.onclick = function() {

                //   v---now it picks up the global event
    doStuff(this, event);return false; // Your onclick attribute value
}
于 2012-12-12T15:23:34.817 回答