2

我是初学者。javascript/jquery如果这个问题听起来很傻，请原谅我。

在阅读本教程时，我尝试将函数中一些变量的值写入 javascript console，以便更好地理解函数的工作原理

$(document).ready(function(){
    $("div.post h2 a").click(function () {
    var a    = $(this),
    href = a.attr('href'),
    content  = a.parent().next();
    console.log('a='+a);
    console.log('a.get(0)='+a.get(0));
    console.log('a parent='+a.parent());
    console.log('a parent.get(0)='+a.parent().get(0));
    console.log("href="+href);
    console.log('content='+content);
    content.load(href + " #content");
    return false; 
});

我稍微修改了html

<div class="post">
    <h2 id="h21"><a href="other/mypage.html">My Page</a></h2>
    <div class="content">
        Teaser text1...
    </div>
</div>
<div class="post">
    <h2 id="h22"><a href="other/myotherpage.html">My Other Page</a></h2>
    <div class="content">
        Teaser text2...
    </div>
</div>
});

当我点击第一个链接时，我得到这个控制台日志输出

a=[object Object]
a.get(0)=file:///home/me/dev/misc/other/mypage.html
a parent=[object Object]
a parent.get(0)=[object HTMLHeadingElement]
href=other/mypage.html
content=[object Object]

我认为 $(this)函数中的表达式将是被单击的元素（即第一个<a element）。为什么它显示为 [object Object]。我无法弄清楚如何a.get(0)变成file:///home/me/dev/misc/other/mypage.html

同样，变量不content应该等于第一个 div（包含 Teaser text1）吗？为什么它显示为 [object Object]？

4

4 回答 4

3

这两行之间有区别：

console.log(content);
console.log('content=' + content);

第一个只是记录content变量。第二个执行连接操作，在记录之前连接字符串和对象。连接字符串和对象会导致toString调用对象的方法，从而导致[object Object]. 为避免这种情况，不要进行连接，直接登录content。正如 mindandmedia 评论的那样，您可以通过将值作为单独的参数传递给console.log：

console.log('content=', content);

href最后，任何具有属性的原生 DOM 链接元素都有toString方法。这将返回href值。所以console.log('a.get(0)=' + a.get(0))获取集合href中第一个元素的值a。

于 2012-05-28T08:16:04.950 回答
2

我认为函数中的 $(this) 表达式将是被点击的元素（即第一个 <a 元素）。为什么它显示为 [object Object]。

该变量a包含一个 jQuery 对象，并且该toString方法没有被覆盖，因此它使用返回对象类型的默认实现。

我无法弄清楚 a.get(0) 如何变成 file:///home/me/dev/misc/other/mypage.html

这些get方法从 jQuery 对象返回 DOM 元素对象，元素的toString方法<a>返回链接指向的 URL。

同样，变量内容不应该等于第一个div（包含Teaser text1）吗？为什么它显示为 [object Object]？

该变量content包含一个包含该元素的 jQuery<div>元素。Usingcontent.get(0)会给你 DOM 元素。

于 2012-05-28T08:19:07.933 回答
0

$(this) 是一个 jQuery 对象，这就是它显示为 [object Object] 的原因。所有 jQuery 选择函数都返回一个 jQuery 对象。如上所述，您可以使用 .html() 来获取 jQuery 对象的 HTML，或者使用 .text() 来获取文本。

这是因为 jQuery 是可链接的，因此您可以执行 $(this).next().parent() 等操作。每个“链”返回一个 jQuery 对象，然后可以在其上运行另一个函数。

编辑：

作为旁注，您可以使用 $(this)[0] 返回我相信的 DOM 元素

于 2012-05-28T08:14:32.100 回答
0

尝试从每个控制台中删除字符串，以便只输出实际变量。

例如替换：

console.log('a='+a);

和

console.log(a);

等等。

于 2012-05-28T08:15:23.380 回答