在PHP / JavaScript中循环浏览HTML代码

Question

Instead of writing:

<ul class="tabs">
      <li><a href="#tab1">1-50</a></li>
      <li><a href="#tab2">51-100</a></li>
      <li><a href="#tab3">101-150</a></li>
      <li><a href="#tab4">151-200</a></li>
      <li><a href="#tab5">201-250</a></li>
      <li><a href="#tab6">251-300</a></li>
      <li><a href="#tab7">300-350</a></li>
      <li><a href="#tab8">351-400</a></li>
      <li><a href="#tab9">401-500</a></li>
</ul>

until 950-1000 which will be tab 20 - is there a way to using a PHP/JavaScript for loop to create more compact code?

Answer 1

I think this should do it for you:

<ul class="tabs">
<?php
$end_at = 1000;
$group_by = 50;
for($i=0;$i<$end_at/$group_by;$i++) {
    echo '<li><a href="#tab', $i + 1, '">', $i * $group_by + 1, '-', ($i+1) * $group_by, "</a></li>\n";
}
?>
</ul>

Example output

Answer 2

Or this:

<ul class="tabs">
  <?php for($i=1;$i<=1000;$i++): ?>
  <?php if($i % 50 == 0): ?>
    <li><a href="#tab<?php echo $i; ?>"><?php echo $i-49 ?>-<?php echo $i; ?></a></li>
  <?php endif; ?>
  <?php endfor; ?>
</ul>