blocks|key|443695|text|这才是正确的方法。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|443696|var+children=$('#animDummy1').children();

children.each(function(idx,+val){
+++$(this).css('left',idx*120%2B'px');
});|code-block|syntax|javascript|443697|或者实际上这样更好。|443698|$('#animDummy1').children().each(function(idx,+val){
+++$(this).css('left',idx*120%2B'px');
})|443699|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

<p>This is the correct way.</p>

<pre><code>var children=$('#animDummy1').children();

children.each(function(idx, val){
   $(this).css('left',idx*120+'px');
});
</code></pre>

<p>or actually this is better.</p>

<pre><code>$('#animDummy1').children().each(function(idx, val){
   $(this).css('left',idx*120+'px');
})
</code></pre>


blocks|key|443785|text|children()返回子对象的jQuery对象，该对象类似于DOM节点数组。您的问题出在循环内部--当您使用[]访问单个对象时，您会得到没有css方法的普通DOM节点。使用.eq(i)或$(children[i])。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|443786|或者直接使用each()方法，该方法允许您执行相同的操作，而不必手动编写for循环。阅读文档以了解如何在回调中获取元素的索引。|443787|entityMap|0|LINK|mutability|MUTABLE|url|http://api.jquery.com/each/^0|0|A|1J|2|1Z|3|2F|6|2M|E|0|6|6|0|0^^$0|@$1|2|3|4|5|6|7|P|8|@$9|Q|A|R|B|C]|$9|S|A|T|B|C]|$9|U|A|V|B|C]|$9|W|A|X|B|C]|$9|Y|A|Z|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|10|8|@]|D|@$9|11|A|12|1|13]]|E|$]]|$1|H|3|-4|5|6|7|14|8|@]|D|@]|E|$]]]|I|$J|$5|K|L|M|E|$N|O]]]]

<p><code>children()</code> returns a jQuery object of the children which resembles an array of DOM nodes. Your problem is inside the loop - when you access individual objects with <code>[]</code> you get back plain DOM nodes which don't have a <code>css</code> method. Either use <code>.eq(i)</code> or <code>$(children[i])</code>.</p>

<p>Or just use the <a href="http://api.jquery.com/each/">each()</a> method, which lets you do the same without having to write a for loop by hand. Read the docs to find out how to get the index of the element inside the callback.</p>


blocks|key|658200|text|这对我来说很好|type|unstyled|depth|inlineStyleRanges|entityRanges|data|658201|$(document).ready(function(){

++++var+children+=+$('#animDummy1').children();++++++++

++++$(children).each(function(index,+item){+++++++++++++++++
++++++++console.log(index);++++++++++++
++++});+++++++++++
});|code-block|syntax|javascript|658202|jsFiddle+Example|offset|length|658203|entityMap|0|LINK|mutability|MUTABLE|url|http://jsfiddle.net/eGQyD/^0|0|0|0|G|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|T|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|U|8|@]|9|@$I|V|J|W|1|X]]|A|$]]|$1|K|3|-4|5|6|7|Y|8|@]|9|@]|A|$]]]|L|$M|$5|N|O|P|A|$Q|R]]]]

<p>This works fine for me</p>

<pre><code>$(document).ready(function(){

    var children = $('#animDummy1').children();        

    $(children).each(function(index, item){                 
        console.log(index);            
    });           
});
</code></pre>

<p><a href="http://jsfiddle.net/eGQyD/" rel="nofollow">jsFiddle Example</a></p>


blocks|key|443881|text|children()返回一组jQuery对象，children[i(anyNumber)]将返回dom元素。因此，在dom元素上调用css+jQuery方法会导致错误。如果要访问给定索引处的任何特定元素，则应使用eq方法。尝尝这个。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|443882|var+children+=+$('#animDummy1').children();
for(var+i+=+0;i+<+children.length;i%2B%2B){
++++children.eq(i).css('left',+(i*120%2B'px')+);
}|code-block|syntax|javascript|443883|.eq()参考：http://api.jquery.com/eq/|443884|entityMap|0|LINK|mutability|MUTABLE|url|http://api.jquery.com/eq/^0|0|A|N|M|1U|3|2Y|2|0|0|0|5|8|P|0|0^^$0|@$1|2|3|4|5|6|7|U|8|@$9|V|A|W|B|C]|$9|X|A|Y|B|C]|$9|Z|A|10|B|C]|$9|11|A|12|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|13|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|14|8|@$9|15|A|16|B|C]]|D|@$9|17|A|18|1|19]]|E|$]]|$1|M|3|-4|5|6|7|1A|8|@]|D|@]|E|$]]]|N|$O|$5|P|Q|R|E|$S|T]]]]

<p><code>children()</code> returns a set of jQuery objects and <code>children[i(anyNumber)]</code> will return the dom element. So calling <code>css</code> jQuery method on dom element will through an error. You should use <code>eq</code> method if you want to access any particular element at a given index. Try this.</p>

<pre><code>var children = $('#animDummy1').children();
for(var i = 0;i &lt; children.length;i++){
    children.eq(i).css('left', (i*120+'px') );
}
</code></pre>

<p><code>.eq()</code> reference: <a href="http://api.jquery.com/eq/" rel="nofollow">http://api.jquery.com/eq/</a></p>


blocks|key|443951|text|使用jQuery的children().each()的其他答案可能对大多数情况都有帮助。但是，如果您确实需要实际的javascript+Array，则可以执行以下操作：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|443952|var+childrenArray+=+$('#animDummy1').children().toArray();|code-block|syntax|javascript|443953|这将允许您在循环中使用实数组，或者与其他需要数组作为参数的函数一起使用。|443954|entityMap^0|9|H|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@$9|P|A|Q|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|R|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|S|8|@]|D|@]|E|$]]|$1|M|3|-4|5|6|7|T|8|@]|D|@]|E|$]]]|N|$]]

<p>The other answers to use jQuery's <code>children().each()</code> are likely helpful for most cases. However, if you do need an actual javascript Array, you can do the following:</p>

<pre><code>var childrenArray = $('#animDummy1').children().toArray();
</code></pre>

<p>This would allow you have a real array for use in a loop or with other functions that require an array as a parameter.</p>


blocks|key|658345|text|++++$(function+()+{
++++++++var+sortOrder+=+[3,+4,+1,+5,2];
++++++++var+onLoad+=+$('#parentDiv>p').get();
++++++++for+(var+i+=+0;+i+<+onLoad.length;+i%2B%2B)+{
++++++++++++var+inRearranging+=+$('#parentDiv>P').get();
++++++++++++var+orderingID+=+"#paragraph"+%2B+sortOrder[i];
++++++++++++$(orderingID).insertBefore("#"+%2B+inRearranging[i].id);
++++++++}
++++});



<div+id="parentDiv">
++++<p+id="paragraph1">1</p>
++++<p+id="paragraph2">2</p>
++++<p+id="paragraph3">3</p>
++++<p+id="paragraph4">4</p>
++++<p+id="paragraph5">5</p>
</div>|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|658346|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>    $(function () {
        var sortOrder = [3, 4, 1, 5,2];
        var onLoad = $('#parentDiv&gt;p').get();
        for (var i = 0; i &lt; onLoad.length; i++) {
            var inRearranging = $('#parentDiv&gt;P').get();
            var orderingID = "#paragraph" + sortOrder[i];
            $(orderingID).insertBefore("#" + inRearranging[i].id);
        }
    });



&lt;div id="parentDiv"&gt;
    &lt;p id="paragraph1"&gt;1&lt;/p&gt;
    &lt;p id="paragraph2"&gt;2&lt;/p&gt;
    &lt;p id="paragraph3"&gt;3&lt;/p&gt;
    &lt;p id="paragraph4"&gt;4&lt;/p&gt;
    &lt;p id="paragraph5"&gt;5&lt;/p&gt;
&lt;/div&gt;
</code></pre>


blocks|key|658391|text|使用jQuery：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|658392|.each()+get+allow到子代为$(‘#someObject’)的数组的每个索引：|658393|$('#animDummy1').each(function(index,+item)+{
+++//+Do+Something+with+each+$(item)+children+of+#animDummy+with+index
});|code-block|syntax|javascript|658394|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|L|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|M|8|@]|9|@]|A|$G|H]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

<p>Use jQuery:</p>

<p>.each() get allow to each index of array with childrens of $('#someObject'):</p>

<pre><code>$('#animDummy1').each(function(index, item) {
   // Do Something with each $(item) children of #animDummy with index
});
</code></pre>


<p>Heres my element, i want to arrange the children inside it by looping through them.</p>

<pre><code>&lt;div id="animDummy1"&gt;
    &lt;div&gt;&lt;/div&gt;
    &lt;div&gt;&lt;/div&gt;
    &lt;div&gt;&lt;/div&gt;
    &lt;div&gt;&lt;/div&gt;
    &lt;div&gt;&lt;/div&gt;
    &lt;div&gt;&lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>Heres how i imagine the code should look but children(), of course, doesn't return an array of the children</p>

<pre><code>var children=$('#animDummy1').children();
for(var i=0;i&lt;children.length;i++){
    children[i].css('left',i*120+'px');
}
</code></pre>

<p>The question - can i get children array for use in a loop? I know i can attach a function for each of children to be executed on, but can i get that increasing "i" in there?</p>

<p>Thnx.</p>


how to get children array of an element in jquery

这是我的元素，我想通过循环来排列里面的子元素。<div id="animDummy1">    <div></div>    <div></div>    <div></div>    <div></div>    <div></div>    <div></div></div>下面是我想象的代码应该是什么样子的，但是...

问如何在jquery中获取元素的子数组
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在jquery中获取元素的子数组EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在jquery中获取元素的子数组
EN