1

I have the following lines of code

$("*[class]").each(function (index, elem)
{
    console.log("Element: " + elem.tagName + " " + $(elem).prop("className"));
});

What I can't understand is that what's the difference between elem and $(elem).
Isn't elem already a jJuery object? if yes then why do we need to put it again like $(elem) in the console.log argument to get the property className.
Why can't we directly do something like elem.prop("className").

4

2 回答 2

3

首先，存在 DOM。这是浏览器在解析 HTML 文档后对其进行理解的方式。浏览器本机理解访问元素和与元素交互的特定方式。

但是，这些内容相当有限且非常冗长。它们不会使书写或阅读变得容易。

这就是创建 jQuery 的原因。

当您使用 构建一个 jQuery 对象时$()，它会创建一个“包装”本机 DOM 对象的新对象，并且确实经常用于包装多个 DOM 对象并一起处理它们。有一整套可用的函数，它们为您完成所有冗长的工作，因此您的代码易于编写和阅读。jQuery 没有什么新东西，但它的书写和阅读要快得多。

在这种情况下，elem是本机 DOM 对象。使用 迭代集合时each，jQuery 不会自动将 DOM 对象转换为 jQuery 对象。这有两个主要原因。首先，您并不总是需要 jQuery 对象。例如，如果您只想获取元素的tagName属性，则只需执行elem.tagName. 其次，创建 jQuery 对象的计算量很大。它可能会显着减慢您的脚本速度。

所以如果你想获取一个jQuery对象，你需要自己使用jQuery构造函数。

于 2013-11-05T19:30:22.580 回答
1

each函数参数是原生 DOM 元素，而不是包装原生 DOM 元素的 jQuery 对象。

请注意，这种行为对于我知道的所有 jQuery 函数都是正确的，val, attr, map... ... 参数始终是 DOM 元素，而不是 jQuery 对象。

您也可以使用this关键字访问该原生元素。

原生元素是实现Element 接口
的元素 jQuery 对象只是一个包装一组原生元素（零到 N 个元素）的对象。
jQuery 对象有更健壮和简单的 API，比如.html()原生元素有笨拙的 API，很多例子......

jQuery 对象具有prop而原生元素只有属性...
$(element).prop('id')VSelement.id
这个例子很糟糕，因为通常原生方法并不简单。:)

于 2013-11-05T19:25:35.560 回答