您现在的位置：程式碼之家 >> 編程語言 > >> 網頁程式設計 >> PHP 程式設計 >> PHP 相關知識

PHP 函式定義與 HTML 嵌入基礎教學：從語法到巢狀迴圈實例

編輯：PHP 相關知識

PHP 的優勢在於能無縫嵌入 HTML，但初學者常混淆「輸出模式」與「程式邏輯模式」。本文以建立乘法表為例，完整示範函式定義、HTML 標籤輸出、巢狀迴圈邏輯與樣式控制，並整理三大觀念重點。

完整程式碼

<?php
/**
 * 輸出 10x10 乘法表，偶數列綠底白字，奇數列白底黑字
 */
function renderMultiplicationTable(): void
{
    echo "<table align='center' border='1' width='600' cellspacing='0'>";
    echo "<caption><h1>乘法表</h1></caption>";

    for ($row = 0; $row < 10; $row++) {
        // 決定列樣式
        $bgColor = ($row % 2 === 0) ? '#ffffff' : 'green';
        $fontColor = ($row % 2 === 0) ? '#000000' : '#ffffff';

        echo "<tr bgcolor='$bgColor'>";

        for ($col = 0; $col < 10; $col++) {
            $value = $row * 10 + $col; // 0~99
            echo "<td style='color: $fontColor'>$value</td>";
        }

        echo "</tr>";
    }

    echo "</table>";
}

// 呼叫函式輸出
renderMultiplicationTable();
?>

三大觀念重點

1. PHP 標籤與輸出模式切換

<?php ... ?>：程式碼區塊，執行邏輯運算。
<?php echo ... ?> 或 <?= ... ?> (PHP 5.4+)：輸出區塊，直接輸出字串/變數。
HTML 區塊：PHP 引擎直接原樣輸出給瀏覽器。

最佳實踐：大段 HTML 使用「關閉標籤法」輸出，避免大量 echo 雜亂：

<?php if ($show): ?>
    <div class="box">內容</div>
<?php endif; ?>

2. 巢狀迴圈：外層控制列，內層控制欄

層級	變數	職責	範例值
外層	$row (0~9)	產生 `<tr>`、決定列樣式	第 3 列 → $row=2
內層	$col (0~9)	產生 `<td>`、計算單元格數值	第 5 欄 → $col=4

數值公式 $row * 10 + $col 將二維座標映射為 0~99 連續數字。

3. 樣式與邏輯分離（進階）

實務上建議將 CSS 移至 <style> 或外部檔案，PHP 僅輸出類別名稱：

<style>
.table-striped tr:nth-child(even) { background: green; color: white; }
.table-striped tr:nth-child(odd)  { background: white; color: black; }
</style>

<?php
echo "<table class='table-striped'>";
// ... 迴圈輸出 td，無需 inline style
?>

常見錯誤與修正

錯誤現象	原因	修正
HTML 標籤顯示在畫面上	忘記 `echo` 或使用單引號未解析變數	確認輸出語法，雙引號解析變數
表格結構崩潰	`<tr>`/`<td>` 未正確閉合	使用編輯器 Emmet 自動補全，或改用模板引擎
中文亂碼	檔案編碼非 UTF-8 或未送 `header('Content-Type: text/html; charset=utf-8')`	儲存為 UTF-8，並在輸出前設定 header