0Pricing
PHP Academy · Aula

HTML dinâmico com loops do PHP

Gere tabelas e listas HTML a partir de arrays PHP dentro de modelos.

HTML dinâmico com loops do PHP é uma aula grátis de PHP Academy no CoddyKit. Esta é a aula 2 de 4. Você pode ler a aula completa abaixo gratuitamente — depois pratica ao vivo no navegador com um editor de código integrado e um tutor de IA 24/7. Faz parte do caminho de aprendizado de PHP Academy, e seu progresso é sincronizado entre a web e o app CoddyKit. O curso de PHP Academy inclui 4 aulas no total.

Geração de HTML com PHP

Um dos usos mais poderosos do PHP é gerar HTML dinamicamente a partir de matrizes de dados — listas, tabelas, menus suspensos, menus de navegação e muito mais.

Gerando uma lista

Renderize uma lista HTML não ordenada a partir de uma matriz PHP:

<?php
$fruits = ['Apple', 'Banana', 'Cherry', 'Durian'];
?>

<ul>
<?php foreach ($fruits as $fruit): ?>
    <li><?= htmlspecialchars($fruit) ?></li>
<?php endforeach; ?>
</ul>

Gerando uma tabela HTML

Crie uma tabela dinâmica a partir de uma matriz bidimensional:

<?php
$users = [
    ['Alice', 'alice@test.com', 'Admin'],
    ['Bob',   'bob@test.com',   'User'],
];
?>
<table>
    <thead><tr><th>Name</th><th>Email</th><th>Role</th></tr></thead>
    <tbody>
    <?php foreach ($users as [$name, $email, $role]): ?>
        <tr>
            <td><?= htmlspecialchars($name) ?></td>
            <td><?= htmlspecialchars($email) ?></td>
            <td><?= htmlspecialchars($role) ?></td>
        </tr>
    <?php endforeach; ?>
    </tbody>
</table>

Gerando um menu suspenso de seleção

Crie um elemento de seleção HTML a partir de uma matriz:

<?php
$countries = ['TR' => 'Turkey', 'US' => 'United States', 'DE' => 'Germany'];
$selected  = 'TR';
?>

<select name="country">
<?php foreach ($countries as $code => $name): ?>
    <option value="<?= htmlspecialchars($code) ?>"
        <?= $code === $selected ? 'selected' : '' ?>>
        <?= htmlspecialchars($name) ?>
    </option>
<?php endforeach; ?>
</select>

Listras alternadas nas linhas

Aplique estilos alternados às linhas para melhorar a legibilidade:

<?php
$rows = range(1, 8);
?>

<table>
<?php foreach ($rows as $i => $row): ?>
    <tr class="<?= $i % 2 === 0 ? 'even' : 'odd' ?>">
        <td>Row <?= $row ?></td>
    </tr>
<?php endforeach; ?>
</table>

Classes CSS condicionais

Aplique classes CSS com base em condições dos dados:

<?php
$tasks = [
    ['title' => 'Write tests',  'done' => true],
    ['title' => 'Deploy app',   'done' => false],
];
?>

<ul class="task-list">
<?php foreach ($tasks as $task): ?>
    <li class="task <?= $task['done'] ? 'done' : 'pending' ?>">
        <?= htmlspecialchars($task['title']) ?>
    </li>
<?php endforeach; ?>
</ul>

Links de paginação

Gere a interface de paginação a partir de um laço for:

<?php
$totalPages  = 10;
$currentPage = 3;
?>

<nav class="pagination">
<?php for ($p = 1; $p <= $totalPages; $p++): ?>
    <a href="?page=<?= $p ?>"
       class="<?= $p === $currentPage ? 'active' : '' ?>">
        <?= $p ?>
    </a>
<?php endfor; ?>
</nav>

Laços aninhados para HTML aninhado

Gere estruturas HTML aninhadas com laços aninhados:

<?php
$menu = [
    ['Home', '/', []],
    ['Products', '/products', ['Widgets', 'Gadgets']],
    ['About', '/about', []],
];
?>

<ul>
<?php foreach ($menu as [$label, $href, $sub]): ?>
    <li><a href="<?= $href ?>"><?= htmlspecialchars($label) ?></a>
    <?php if ($sub): ?>
        <ul>
        <?php foreach ($sub as $child): ?>
            <li><?= htmlspecialchars($child) ?></li>
        <?php endforeach; ?>
        </ul>
    <?php endif; ?>
    </li>
<?php endforeach; ?>
</ul>

Tratamento do estado vazio

Sempre trate o caso de uma matriz vazia nos modelos:

<?php
$posts = [];
?>

<?php if (!empty($posts)): ?>
    <ul>
    <?php foreach ($posts as $post): ?>
        <li><?= htmlspecialchars($post['title']) ?></li>
    <?php endforeach; ?>
    </ul>
<?php else: ?>
    <p class="empty-state">No posts found. <a href="/new">Create one!</a></p>
<?php endif; ?>

Gerando atributos de dados

Passe dados para JavaScript por meio de atributos de dados HTML:

<?php
$products = [
    ['id' => 1, 'name' => 'Widget', 'price' => 9.99],
    ['id' => 2, 'name' => 'Gadget', 'price' => 24.99],
];
?>

<div class="product-grid">
<?php foreach ($products as $p): ?>
    <div class="product-card"
         data-id="<?= $p['id'] ?>"
         data-price="<?= $p['price'] ?>">
        <?= htmlspecialchars($p['name']) ?>
    </div>
<?php endforeach; ?>
</div>

PHP e JSON para JavaScript

Passe matrizes PHP para JavaScript com segurança usando json_encode:

<?php
$config = [
    'apiUrl'  => '/api/v1',
    'userId'  => $user['id'] ?? 0,
    'locale'  => 'en-US',
];
?>

<script>
const APP_CONFIG = <?= json_encode($config, JSON_HEX_TAG | JSON_HEX_APOS) ?>;
console.log(APP_CONFIG.apiUrl);
</script>

Verificação rápida

Qual função deve ser usada ao imprimir strings controladas pelo usuário dentro de HTML para evitar XSS?

Recapitulação: HTML dinâmico com laços

Técnicas principais:

  • Use a sintaxe alternativa de dois-pontos de foreach/for nos modelos
  • Sempre faça o escape da saída com htmlspecialchars()
  • Use classes CSS condicionais com um operador ternário nos atributos
  • Trate matrizes vazias com if/else ao redor dos laços
  • Passe dados do PHP para JavaScript por meio de json_encode()

Perguntas Frequentes

A aula “HTML dinâmico com loops do PHP” é grátis?

Sim — o texto completo de “HTML dinâmico com loops do PHP” é grátis para ler aqui na web. Para praticá-la interativamente (um editor de código integrado e um tutor de IA 24/7) e desbloquear o restante do curso de PHP Academy, atualize para CoddyKit PRO. O curso de PHP Academy inclui 4 aulas no total.

O que vou aprender em “HTML dinâmico com loops do PHP”?

Gere tabelas e listas HTML a partir de arrays PHP dentro de modelos. Você pratica PHP Academy com código prático que executa diretamente no navegador, e um tutor de IA 24/7 responde suas dúvidas enquanto trabalha na aula.

Preciso ter experiência prévia para começar PHP Academy?

Nenhuma experiência prévia é necessária. PHP Academy no CoddyKit é estruturado para alunos iniciantes até avançados, então você pode começar aqui ou desde o início e aprender no seu ritmo. Esta é a aula 2 de 4.

Quanto tempo leva a aula “HTML dinâmico com loops do PHP”?

A maioria das aulas CoddyKit leva cerca de 5–10 minutos. Cada uma é compacta e interativa, então você faz progresso constante e retoma exatamente de onde parou entre web e app.

Posso escrever e executar código nesta aula de PHP Academy?

Sim. Cada aula de PHP Academy inclui um editor de código integrado, então você escreve e executa código real direto no navegador e recebe feedback de IA instantaneamente — nenhuma configuração local necessária.

Todas as aulas deste curso

  1. Tags do PHP e sintaxe de incorporação
  2. HTML dinâmico com loops do PHP
  3. Inclusão e exigência de arquivos
  4. Padrão de modelos: separando a lógica da visualização
← Voltar para PHP Academy