以下是20个PHP与HTML混合编程的实用示例,每个示例都附带简单讲解:
基础输出
变量输出
<p>当前用户:<?= $username ?></p>
直接输出变量值,<?= 是 <?php echo 的简写
计算结果显示
<p>合计:¥<?= number_format($price * $quantity, 2) ?></p>
在HTML中嵌入数学运算
条件控制
登录状态判断
<div class="user-panel"> <?php if ($isLoggedIn): ?> <a href="/logout">退出</a> <?php else: ?> <a href="/login">登录</a> <?php endif; ?> </div>
错误消息显示
<?php if (!empty($error)): ?> <div class="alert"><?= htmlspecialchars($error) ?></div> <?php endif; ?>
循环结构
简单列表
<ul> <?php foreach ($items as $item): ?> <li><?= $item ?></li> <?php endforeach; ?> </ul>
带索引的列表
<ol> <?php foreach ($students as $index => $student): ?> <li>第<?= $index+1 ?>名:<?= $student ?></li> <?php endforeach; ?> </ol>
表单处理
表单回显
<input type="text" name="email" value="<?= isset($_POST['email']) ? htmlspecialchars($_POST['email']) : '' ?>">
复选框状态保持
<input type="checkbox" name="subscribe" <?= isset($_POST['subscribe']) ? 'checked' : '' ?>>
模板组织
头部引入
<!DOCTYPE html> <html> <head> <?php include 'meta.php' ?> </head>
页脚组件
<footer>
<?php include 'footer_content.php' ?>
<p>当前年份:<?= date('Y') ?></p>
</footer>动态样式
条件class
<div class="item <?= $isActive ? 'active' : '' ?>">
行颜色交替
<tr class="<?= $index % 2 ? 'bg-gray-100' : '' ?>">
数据安全
JSON安全输出
<script> var userData = <?= json_encode($user, JSON_HEX_TAG) ?>; </script>
URL参数构建
<a href="detail.php?id=<?= urlencode($productId) ?>">
实用技巧
分页显示
<?php for ($i = 1; $i <= $totalPages; $i++): ?> <a href="?page=<?= $i ?>"><?= $i ?></a> <?php endfor; ?>
时间格式化
<time><?= date('Y-m-d H:i', strtotime($postTime)) ?></time>混合增强
CSS动态生成
<style>
.header {
background: <?= $themeColor ?>;
}
</style>JS动态参数
<script>
const API_KEY = '<?= getenv('API_KEY') ?>';
</script>现代实践
组件化按钮
<?php function button($text, $type = 'primary') { ?>
<button class="btn-<?= $type ?>"><?= $text ?></button>
<?php } ?>
<?php button('提交', 'success') ?>AJAX响应
<?php
header('Content-Type: application/json');
echo json_encode($data);
exit;
?>关键原则总结
安全第一:始终过滤输出(
htmlspecialchars/json_encode)逻辑分离:复杂业务逻辑放在HTML之外
保持简洁:避免在HTML中编写长段PHP代码
组件复用:重复UI元素封装为函数或组件
现代实践:考虑使用模板引擎提升可维护性
这些示例覆盖了90%的日常开发场景,建议从简单示例开始实践,逐步组合使用这些技术。