如何显示每两个子阵列'在切换其类属性的顺序时,NAME在单独的div中值,并使用循环将div对包装在包含div中?
这是我的代码:
function foo(arrA){
if(!arrA || arrA[0]===0)
return undefined;
let arrB =[];
let prevEntry = 1;
for(let i=0; i <arrA.length; i++){
if (2*prevEntry == arrA[i]){
prevEntry *= 2;
arrB.push(Math.pow(arrA[i], 2)).toString();
}
}
return arrB;
}
console.log(foo([2,4,6,8,9,15,16,27]));
返回:
<div class="row clearfix">
<?
$arr = array(
array('ID'=>1, 'NAME'=>'a'),
array('ID'=>2, 'NAME'=>'b'),
array('ID'=>3, 'NAME'=>'c'),
array('ID'=>4, 'NAME'=>'d'),
array('ID'=>5, 'NAME'=>'f'),
array('ID'=>6, 'NAME'=>'g')
);
$i = 0;
$el_in_row = 2;
foreach($arr as $key => $arItem)
{
$i++;
$odd = ($i%2) ? true : false;
$class = ($odd === true)?'vertical':'horizontal';
?>
<div class="<?=$class;?>">
<?=$arItem['NAME'];?>
</div>
<? ?>
<? if($i >= $el_in_row): $i = 0;?>
</div><div class="row clearfix">
<? endif;?>
<?
}
?>
</div>
但我需要这个结果:
<div class="row clearfix">
<div class="vertical">a</div>
<div class="horizontal">b</div>
</div>
<div class="row clearfix">
<div class="vertical">c</div>
<div class="horizontal">d</div>
</div>
<div class="row clearfix">
<div class="vertical">f</div>
<div class="horizontal">g</div>
</div>
答案 0 :(得分:0)
PHP中用于构建对(或三元组,......)的方便的数组函数是array_chunk()
:
$pairs = array_chunk($arr, 2);
然后,当您想要输出迭代时,可以在迭代中进行迭代。
由于每个对中只需要 name 列,下一个方便的数组函数是array_column()
,它将该对转换为一对名称。
$names = array_column($pair, 'NAME');
除了将这些名称与您要输出的类组合在一起之外,array_combine()
对于使用类键入名称非常有用:
array_combine(['vertical', 'horizontal'], $names);
要将它们捆绑在一起,您可以使用生成器函数从输入数组中生成这些对。函数具有可以控制参数的好处,我在这里使用默认值来匹配您的示例:
function chunk_columns(array $array, $column = 'NAME', array $keys = ['vertical', 'horizontal']) {
$pairs = array_chunk($array, count($keys));
foreach ($pairs as $pair) {
yield array_combine(
$keys,
array_column($pair, $column)
);
}
}
该函数的用法示例如下(在HTML中使用PHP进行模板化):
<?php foreach (chunk_columns($arr) as $chunk) { ?>
<div class="row clearfix">
<?php foreach ($chunk as $class => $name) { ?>
<div class="<?= $class ?>"><?= $name ?></div>
<?php } ?>
</div>
<?php } ?>
在使用变量插入HTML时要小心,要将其值正确编码为HTML,请参阅htmlspecialchars()
。我把它留下来让它更具代表性,在现实生活中,输出需要适当的HTML编码。
现在,对于带有示例数据的输出来完成答案:
<div class="row clearfix">
<div class="vertical">a</div>
<div class="horizontal">b</div>
</div>
<div class="row clearfix">
<div class="vertical">c</div>
<div class="horizontal">d</div>
</div>
<div class="row clearfix">
<div class="vertical">f</div>
<div class="horizontal">g</div>
</div>
答案 1 :(得分:0)
循环应如下所示:奇数行以<div class="row clearfix">
开头,偶数行以</div>
结束(关闭)。
$i=0;
foreach($arr as $ar)
{
$i++;
if($i%2) //odd rows
{
echo '<div class="row clearfix">'.PHP_EOL;
echo ' <div class="vertical">'.$ar['NAME'].'</div>'.PHP_EOL;
}
else //even rows
{
echo ' <div class="horizontal">'.$ar['NAME'].'</div>'.PHP_EOL;
echo '</div>'.PHP_EOL;
}
}
答案 2 :(得分:0)
我认为我没有比这更快/更干爽:
(请记住,我使用子数组的索引来查找奇数/偶数 - 而不是ID元素值。)
代码:(Demo)
$arr = array(
array('ID'=>1, 'NAME'=>'a'),
array('ID'=>2, 'NAME'=>'b'),
array('ID'=>3, 'NAME'=>'c'),
array('ID'=>4, 'NAME'=>'d'),
array('ID'=>5, 'NAME'=>'f'),
array('ID'=>6, 'NAME'=>'g')
);
$classes=['vertical','horizontal'];
foreach($arr as $i=>$a){
if(!($i & 1)){ // if non-odd number; bitwise operator is ~x10 faster than modulus
echo "<div class=\"row clearfix\"><div class=\"",reset($classes),"\">{$a['NAME']}</div>";
}else{
echo "<div class=\"",next($classes),"\">{$a['NAME']}</div></div>";
$classes=array_reverse($classes); // re-order the array every odd $i iteration
}
}
输出:
<div class="row clearfix">
<div class="vertical">a</div>
<div class="horizontal">b</div>
</div>
<div class="row clearfix">
<div class="horizontal">c</div>
<div class="vertical">d</div>
</div>
<div class="row clearfix">
<div class="vertical">f</div>
<div class="horizontal">g</div>
</div>
这是另一种方法,它提供相同的输出效率更高,因为它具有更少的迭代函数调用:
$arr = array(
array('ID'=>1, 'NAME'=>'a'),
array('ID'=>2, 'NAME'=>'b'),
array('ID'=>3, 'NAME'=>'c'),
array('ID'=>4, 'NAME'=>'d'),
array('ID'=>5, 'NAME'=>'f'),
array('ID'=>6, 'NAME'=>'g')
);
$classes=['vertical','horizontal'];
$x=0;
foreach(array_chunk(array_column($arr,'NAME'),2) as $a){
echo "<div class=\"row clearfix\">\n";
echo "\t<div class=\"{$classes[$x]}\">{$a[0]}</div>\n";
echo "\t<div class=\"{$classes[$x^=1]}\">{$a[1]}</div>\n";
echo "</div>\n";
}
array_column()
将所有NAME
值存储在新的索引单维数组中。array_chunk()
将生成的数组重组为一个包含两个索引元素的数组数组。$classes
值切换背后的“魔力”来自XOR bitwise operator ^
。此方法的效果是$classes
对循环的每次迭代的第二次访问将$x
从0
更改为1
或1
更改为{{1 }}。0
内的元素始终为$a
和0
,因此可以定期/静态方式访问它们。