Chuong XI : Bài 3: Kết hợp PHP và HTML

Bài 3: Kết hợp PHP và HTML

 

Nói đến PHP, người ta nói đến lập trình web. Nói đến HTML, người ta cũng nói đến làm web. Vậy ko có lý gì HTML và PHP lại ko đi được cùng với nhau! Bài 3 sẽ đề cập tới một vấn đề rất phổ biến khi lập trình PHP: Kết hợp mã PHP với HTML.

Trước hết, chúng ta hãy dành ít phút tìm hiểu cách thức hoạt động của World Wide Web (WWW).

Hãy tưởng tượng, bạn đang muốn truy cập trang web www.example.com/welcome.html. Bạn mở trình duyệt web, gõ vào ô địa chỉ: www.example.com/welcome.html và bấm Enter. Trang web sẽ hiện ra, gần như ngay tức khắc (ở đây ko nói đến mạng dial up siêu chậm nhá )

Vậy, điều gì đã xảy ra từ lúc bạn bấm Enter cho đến lúc trang web xuất hiện? Hãy cùng tớ xem xét những đoạn băng “behind the scene” này:

1. Ngay sau khi bạn bấm Enter, trình duyệt bạn đang dùng sẽ gửi một thông điệp (message) lên mạng, cho biết bạn đang muốn yêu cầu (request) trang www.example.com/welcome.html
2. Thông điệp đó được chuyển tới máy tính tại địa chỉ www.example.com/welcome.html
3. Máy chủ trên máy tính đó sẽ nhận được thông điệp và bắt đầu tìm kiếm file HTML được yêu cầu.
4. Máy chủ gửi file HTML đó về máy tính vừa yêu cầu (chính là máy tính của bạn). Nếu ko tìm thấy file HTML được yêu cầu, đơn giản là máy chủ sẽ trả lại một thông báo lỗi.
5. Trình duyệt của bạn, sau khi nhận về trang HTML, sẽ hiển thị nó ra màn hình.

Ở bước thứ 4, nếu file bạn yêu cầu là 1 file mang đuôi .php, thay vì gửi trả lại nội dung nguyên gốc của file, máy chủ sẽ lần lượt thực hiện thêm các bước:
1. Quét file trong chế độ HTML, gửi trả về nội dung HTML.
2. Ngay khi gặp <?php, máy chủ sẽ chuyển sang chế độ PHP, bắt đầu thực thi các lệnh PHP cho đến khi gặp ?>. Hiển nhiên nếu các lệnh PHP có output, máy chủ sẽ trả những output đó cho trình duyệt.
3. Kết thúc chế độ PHP (ra ngoài ?>), máy chủ quay lại chế độ HTML.
Quá trình cứ thế tiếp tục, cho đến khi kết thúc file .php.

Vậy là đã xong phần nói ngoài lề. Giờ ta bắt đầu vào Bài 3.

Ở Bài 1, tớ đã cùng các bạn viết chương trình đầu tiên, Hello World, bằng PHP. Giờ thử nhìn một file .php cũng mang nội dung Hello World:

HTML Code:

 

<html>

<head>

<title>Hello World</title>

</head>

<body>

<p>Hello World!</p>

</body>

</html>

Như ví dụ trên đây, các bạn có thể thấy: Đây chỉ đơn thuần là một file HTML, mang đuôi .php. Chẳng có gì đặc biệt! Và khi trình duyệt yêu cầu file này, máy chủ chỉ việc gửi trả nội dung nguyên gốc mà ko cần phải xử lý một chút lệnh nào cả.

Giờ hãy thử nâng cấp file .php đó bằng cách thêm vào nó một chút mã PHP:

PHP Code:

<html>
<head>
<title>Hello World</title>
</head>
<body>
<?php
echo “<p>Hello World!</p>”;
?>
</body>
</html>
Khi chạy script này, kết quả khi view source code cũng ko khác gì ví dụ đầu tiên. Chỉ có cách làm là khác, thay vì chỉ sử dụng HTML, ta kết hợp cả PHP và HTML trong cùng một file.

Giờ, nếu ta muốn in ra màn hình chữ Hello ở một dòng, và World ở một dòng, ta sẽ làm ntn?

Nếu các bạn có biết về HTML, thì sẽ nghĩ ngay đến thẻ <br />:

PHP Code:

<html>
<head>
<title>Hello World</title>
</head>
<body>
<?php
echo “<p>Hello<br />World!</p>”;
?>
</body>
</html>
Kết quả output thật mỹ mãn và chẳng có gì đáng nói.

Tuy vậy, nếu các bạn còn nhớ, tớ đã từng nói \n có thể dùng để xuống dòng trong PHP. Vậy, thừa thắng xông lên, bạn sẽ thay <br /> bằng \n:

PHP Code:

<html>
<head>
<title>Hello World</title>
</head>
<body>
<?php
echo “<p>Hello\nWorld!</p>”;
?>
</body>
</html>
Kết quả? Thất bại. Trên màn hình, chữ Hello và World vẫn nằm cùng một dòng. Tại sao lại như vậy? Làm thế nào để giải quyết vấn đề này?

Trả lời: \n đúng là để xuống dòng, nhưng đó là xuống dòng trong PHP output, nó ko đảm bảo việc xuống dòng khi cái PHP output đó được trình duyệt xử lý dưới dạng mã HTML.

Để trình duyệt xử lý chính xác những vấn đề ntn, ta cho toàn bộ xâu đó vào thẻ <pre>, thẻ quyết định việc giữ nguyên định dạng của xâu:

PHP Code:

<html>
<head>
<title>Hello World</title>
</head>
<body>
<?php
echo “<p><pre>Hello\nWorld!</pre></p>”;
?>
</body>
</html>
Một lần nữa, kết quả hiện ra thật mỹ mãn.

Ta xét thêm một ví dụ nữa.

PHP Code:

<?php
print_r($_SERVER);
?>
Script trên làm trò gì vậy ta? Chưa cần biết print_r và $_SERVER là gì, bạn chỉ cần thấy đoạn nó output ra mấy dòng sau: (tớ phải post ảnh vì UDS ko cho phép đưa đoạn ý vào bài viết)

Phản ứng đầu tiên? Bạn sẽ thấy hơi chóng mặt phải ko ạ? Bạn sẽ tự hỏi: Nhiều thứ thế kia viết líu ríu vào nhau thì ai mà đọc được? Tại sao ko tách dòng ra chứ?

À, nói đến tách dòng, bạn sẽ nhớ ngay tới thẻ <pre> mà tớ nói bên trên. Bạn sẽ thêm nó vào script của mình:

PHP Code:

<?php
echo “<pre>”;
print_r($_SERVER);
echo “</pre>”;
?>
Kết quả trả về ko thể nói là dễ đọc, mà phải nói là rất dễ đọc , tuy (có thể) bạn chẳng hiểu cái gì sất!

Hãy tạm hài lòng với những gì mình vừa làm được và thư giãn một chút trước khi ta bước vào Bài 4.

Bật mí trước: Chúng ta đã biết tới hàm var_dump in ra kiểu và giá trị của biến, hàm print_r (bạn đoán là) in ra các giá trị của một cái $_SERVER gì đó. Vậy trong Bài 4, ta sẽ cùng tìm hiểu print_r là gì, sử dụng ra sao, và còn những hàm nào như vậy nữa.

identical(UDS)

 

  1. Leave a comment

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: