Question

我正在查看以下来自http://jqfundamentals.com/chapter/jquery-basics的显式迭代示例：

$( 'li' ).each(function( index, elem ) {
  // this: the current, raw DOM element
  // index: the current element's index in the selection
  // elem: the current, raw DOM element (same as this)
  $( elem ).prepend( '<b>' + index + ': </b>' );
});

注释将elem称为原始DOM元素，但代码在.prepend()上调用elem。

我刚刚开始使用jQuery，但我的理解是你只能在jQuery对象上调用jQuery方法 - 而不是在原始DOM元素上。我误解了吗？

Answer 1

代码不会在prepend上调用elem，它会在$(elem)上调用它，使其成为jquery对象。

Answer 2

您正在将原始DOM元素再次转换为jquery对象..请参阅elem中的第一个$符号。 elem是原始的，但$(elem)是jquery对象，因此您可以使用任何可用的jQuery函数（方法）prepend作为一个

   $( elem ).prepend( '<b>' + index + ': </b>' );
//-^-- here this $ sign

Answer 3

elem是一个原始DOM元素。通过包装elem $(elem)，您将从原始DOM元素创建一个jQuery对象。 jQuery允许你这样做。然后，您在从.prepend()创建的jQuery对象上调用elem。

Answer 4

这可能会有所帮助..

var test = document.getElementById('test') //returns a HTML DOM Object
var test = $('#test') //returns a jQuery Object
var test = $('#test')[0] //returns a HTML DOM Object

Answer 5

上面示例中的“elem”可以是任何标记（h1，p，正文，标记的组合，对id或类的特定引用）就像CSS一样。然后“prepend”是对该元素执行的操作。在这种情况下，前置操作采用一个参数，这是另一个将动态放入html的元素，作为页面上与您选择的“elem”匹配的每个元素的第一个子元素

Answer 6

jQuery创建一个“包装”元素 - 一个jQuery对象所以也许这会给你一些见解：

$('li').each(function (index, elem) {
    alert(elem === this); // true
    alert($(this) === $(elem)); // false
    alert(elem.tagName + $(elem).tagName); // LI undefined
    alert(typeof elem + typeof $(this));// object object
    alert(elem.tagName ===  $(this).prop('tagName')); // true
});

注意第二个alert = false，所以即使它们“引用”到同一个元素，$（this）和$（elem）也不是相同的包装对象。请注意，“raw”元素具有.tagName，而jQuery包装对象则不具有.tag，

所以你的

$(elem).prepend('<b>' + index + ':</b>');

jquery获取包装的elem（$(elem)），然后以索引和“：”字符作为其内容文本预先添加一个新的包装'b'元素

编辑：在另一个示例和前置说明中，将tagName的属性示例添加到jQuery对象。

Answer 7

与Prototype不同，jQuery不扩展本机对象。这就是你必须使用$函数来获取jQuery包装的原因。

原始DOM元素与jQuery对象

7 个答案: