如何使用jQuery选择器访问实际DIV

Question

我有一个由其他Divs动态填充的DIV ...

<div id="wrapper">
</div>
//javascript 
 for(//a bunch of times){
  var d = document.cloneNode('divModel');
  d.foo = {//bunch of stuff };
  document.getChildById('wrapper').appendChild(d) is applied later to fill in child divs
}

现在，我想循环穿过包装纸的孩子，并使用该FOO做点事。

当我通过普通JavaScript

进行操作时

document.getElementById('wrapper').childNodes[x].foo

正如我期望的那样

但是

$('#wrapper').each(function (i, element){
      console.log(element.foo); //foo here is undefined
})

导致一堆未定义的

所以...我猜想jQuery实际上是在处理我的Divs的一些内部包装器，而不是直接与Divs打交道。我很好奇我如何（或者如果可能的话）我可以访问此循环中的实际Div，以访问我的自定义foo。

编辑根据您到目前为止的所有答案（非常感谢您的时间），我觉得我需要澄清，因为每个人似乎都缺少我的实际问题...我已经修改了上面的代码更明确。

我没有语法错误（在我的实际代码中）。jQuery循环正确地通过包装纸的孩子，它只是没有返回实际的孩子（Divs），它正在返回自己的版本，并且此自定义版本不包含我的附录Foo。

因此，我需要的是能够回到实际的DOM对象，而不是周围的jQuery包装器。这可能吗？

Answer 1

您忘记了孩子（如前所述）：

$('#wrapper').children().each(function (i, element)...

Answer 2

您完全正确，除了选择器关闭。您需要$("#wrapper")。

$("#wrapper").each(function(i,e) { console.log(e.id) });

编辑

确认可以从dom元素中恢复对象...

var c = document.getElementById('container');
var el = document.createElement('div');
el.id = 'new';
el.innerText='the test element';
el.test = { hello: "world" };
c.appendChild(el);
console.log('javascript: ' + document.getElementById('new').test.hello);
$("#container div").each(function(i,e) {
    if (e.test) console.log('jquery: ' + e.test.hello);
});

http://jsfiddle.net/eeyhr/3/

Answer 3

一些选择：

$('#wrapper').children().each(function (i, element) { ... });
$('#wrapper > *').each(function (i, element) { ... });

Answer 4

或更加明确，因为您说您只专注于儿童divs：

$('#wrapper div').each( function() {
    // do some funky stuff
    alert($(this).attr('id')); // displays element ID
});

要进行进一步的学习，请参考此jQuery帮助页面：

http://api.jquery.com/category/selectors/basic-css-selectors/