javascript - 为什么 Chrome 对内联事件使用 `with`

Question

如果您在 Chrome 中查看此小提琴并单击打开 js 控制台的触发器文本，您将看到：

所有这些with块的原因是什么，它的价值是什么？

Answer 1

在我看来，当事件处理程序被指定为 HTML“onclick”属性时，它似乎是浏览器为事件处理程序创建函数的方式。我认为这样做是：

• 为事件对象和您提供的代码创建一个带有单个参数的事件处理函数；
• 使元素（<a>标签）、空对象 (?) 和文档对象的属性看起来是该函数中代码的可用符号。

也就是说，this[0]是<a>元素本身，this[1]看起来像一个空的 Object 实例，并且this[2]是文档对象。这意味着在您作为“onfoo”事件处理程序属性的一部分编写的代码中（而不是从直接 JavaScript 代码绑定的任何普通事件处理程序中的代码），可以引用目标元素的属性（用于您正在设置属性）和文档元素的属性，就好像它们存在于范围链中一样。

如果你稍微改变一下代码：

$('<a href=# onclick="console.log(baseURI);"> ...

然后你得到<a>元素的“baseURI”属性的值。不需要在“baseURI”前面加上任何明确引用<a>元素的 DOM 节点的东西；它只是“那里”，就好像它是var在某个封闭范围内声明的。

（现在检查 w3c 规范……）编辑——我还没有找到任何规定哪些符号应该可用于事件处理程序中的脚本代码。这真的很奇怪。

再次编辑——Firefox 似乎也在做同样的事情，尽管我在with任何地方都没有看到明确的声明。

Answer 2

with将它的参数移到范围堆栈的顶部。所以它甚至高于全局对象、函数参数等。不知道他们为什么使用它。也许它是一个生成的代码。