javascript 如何使用for循环迭代子项
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9819592/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to iterate over children with for-loop
提问by user1027167
I want to iterate over all childs of a jQuery's .children()return value, like this:
我想遍历 jQuery.children()返回值的所有子项，如下所示：
var childs = $element.children();
for (var i = 1; i < childs.length - 1; i++)
childs__.foo();
What do I have to write in the 3 line instead of __, to access the i-th child?
我必须在第 3 行而不是 , 中写什么__才能访问第 i 个孩子？
I want this becaus I want to access the (i-1)-th and (i+1)-th child in the loop, like this:
我想要这个，因为我想访问循环中的 (i-1)-th 和 (i+1)-th 子项，如下所示：
var childs = $element.children();
for (var i = 1; i < childs.length - 1; i++)
{
childs<<i>>.css('height', childs<<i - 1>>.height());
childs<<i>>.css('width', childs<<i + 1>>.width());
}
So I assume the each()function will not work.
所以我认为该each()功能不起作用。
回答by Strelok
childsis a javascript array. So you access objects within the array by childs[indexOfElement]. In your case childs[i].
childs是一个javascript 数组。因此，您可以通过childs[indexOfElement]. 在你的情况下childs[i]。
var childs = $element.children();
for (var i = 1; i < childs.length - 1; i++)
childs[i].foo();
and
和
var childs = $element.children();
for (var i = 1; i < childs.length - 1; i++)
{
childs[i].css('height', childs[i-1].height());
childs[i].css('width', childs[i+1].width());
}
BUT: Your code has an error. The element from the children collection is NOT a jQuery object. It's just an DOM element. So you have to wrap them in $(...)to use jQuery functions. So your code will become:
但是：您的代码有错误。来自 children 集合的元素不是 jQuery 对象。它只是一个 DOM 元素。因此，您必须将它们包装起来$(...)才能使用 jQuery 函数。所以你的代码将变成：
var childs = $element.children();
for (var i = 1; i < childs.length - 1; i++)
{
var thisElement = $(childs[i]);
var next = $(childs[i+1]);
var prev = $(childs[i-1]);
thisElement.css('height', prev.height());
thisElement.css('width', next.width());
}
PS. It should be named children. :)
附注。它应该被命名为children。:)
回答by slash197
Wouldn't it be easier with this selector http://api.jquery.com/nth-child-selector/?
使用这个选择器http://api.jquery.com/nth-child-selector/不是更容易吗？
回答by turpachull
You could use the each() function, and use "this" to get the current object. Then you can use the next() and prev() functions instead of i+1 and i-1 respectively. I haven't tested the code so it may or may not work; hopefully points in the right direction :)
您可以使用 each() 函数，并使用“this”来获取当前对象。然后你可以分别使用 next() 和 prev() 函数代替 i+1 和 i-1 。我还没有测试过代码，所以它可能会也可能不会；希望指向正确的方向:)
jQuery.each($element.children(), function() {
{
$(this).css('height', $(this).prev().height());
$(this).css('width', $(this).next().width());
}
回答by MrCode
The each()function will work, take a look at this:
该each()功能将工作，看看这个：
$('#something').children().each(function(index) {
$(this).css('width', (parseInt($(this).css('width').replace('px', '')) + index) + "px");
// to access the previous and next element:
$(this).prev().css('width', '100px');
$(this).next().css('width', '200px');
});
That will modify the width, adding the index as a pixel on each iteration - just to demo how to get the index.
这将修改宽度，在每次迭代时将索引添加为像素 - 只是为了演示如何获取索引。
回答by Niranjan Singh
Use .eq()to get the one at the specified index of the matched dom elements set.
使用.eq()获取匹配的 dom 元素集的指定索引处的那个。
var childs = $element.children();
for (var i = 1; i < childs.length - 1; i++)
{
childs.eq(i).css('height', childs.eq(i - 1).height());
childs.eq(i).css('width', childs.eq(i + 1).width());
}
and the another simple approach is to achieve this without for loop use .each()
另一个简单的方法是在没有 for 循环使用.each() 的情况下实现这一点
jQuery.each($element.children(), function() {
{
$(this).css('height', this.prev().height());
$(this).css('width', this.next().width());
}
