javascript - jquery 假定元素 id？正常行为？

Question

我有以下 index.html：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript">
        </script>
        <script type="text/javascript">
            jQuery(document).ready(function($) {
                console.log(foo); // jQuery assumes foo is an id?
            });
        </script>
    </head>
    <body>
        <div id="foo">i'm a div</div>
    </body>
</html>

控制台输出：

<div id="foo">i'm a div</div>

为什么？

score 7 · Accepted Answer

这与 jQuery 无关。

这是因为命名元素（具有IDorname属性的元素）成为窗口对象的属性。

console.log(foo)等同于console.log(window.foo);

由于你div是一个命名元素（id="foo"），它被添加到window.

窗口上的命名访问

score 2 · Accepted Answer

这不是 jQuery 行为，它（最初）是 Internet Explorer 行为。IE 总是为每个具有id属性的 DOM 元素创建全局变量。该变量以命名id并引用 DOM 元素。最近，其他浏览器也纷纷效仿。

score 0 · Accepted Answer

JQuery 不假定，而是 JavaScript 假定。您foo的未加引号，因此它必须是标识符或未定义。带有 id 的元素foo恰好在您的脚本范围内，因此它所标识的元素会被记录下来。

如果您将其重命名为bar，那么您将能够引用bar它，因为它是顶级 id。

请注意，这种用法不受欢迎，因为在不引用 html 的情况下不清楚您在代码中所做的事情。通常首选使用document.getElementById(...)或其变体，因为很清楚您在做什么。

javascript - jquery 假定元素 id？正常行为？

3 回答 3

Related

Reference