> 백엔드 개발 > PHP 튜토리얼 > PHP 및 MySQL을 사용하여 JSON 데이터를 HTML 형식으로 변환하는 방법은 무엇입니까?

PHP 및 MySQL을 사용하여 JSON 데이터를 HTML 형식으로 변환하는 방법은 무엇입니까?

WBOY
풀어 주다: 2023-07-12 08:30:01
원래의
1152명이 탐색했습니다.

PHP 및 MySQL을 사용하여 JSON 데이터를 HTML 형식으로 변환하는 방법은 무엇입니까?

웹 개발에서 우리는 PHP와 MySQL을 통해 백엔드에서 얻은 데이터를 HTML 형식으로 프런트엔드 페이지에 표시해야 하는 경우를 자주 접합니다. 일반적으로 사용되는 데이터 형식 중 하나는 JSON입니다. 이 기사에서는 PHP와 MySQL을 사용하여 JSON 데이터를 HTML 형식으로 변환하는 방법을 소개하고 해당 코드 예제를 제공합니다.

  1. 데이터베이스 준비

먼저 데이터베이스를 준비하고 해당 데이터를 저장해야 합니다. MySQL을 예로 들어, 사용자의 이름과 나이 정보를 저장하는 "users"라는 테이블이 있다고 가정합니다. 테이블의 구조는 다음과 같습니다:

CREATE TABLE users (

id INT(11) AUTO_INCREMENT PRIMARY KEY,
name VARCHAR(50) NOT NULL,
age INT(3) NOT NULL
로그인 후 복사

);

몇 가지 테스트 데이터를 테이블에 삽입합니다:

INSERT INTO users (name, age) VALUES ('Zhang San', 20);
INSERT INTO users (name, age) VALUES ('lee思', 25);
INSERT INTO users (name, age) VALUES ('王五', 30);

  1. JSON 데이터를 가져오는 PHP 코드

PHP를 사용하여 데이터베이스에서 JSON 데이터 가져오기 데이터를 가져와 JSON 형식으로 변환합니다.

//데이터베이스에 연결
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "test";
$conn = new mysqli ($ servername, $username, $password, $dbname);

// 연결 성공 여부 확인
if ($conn->connect_error) {

die("连接失败: " . $conn->connect_error);
로그인 후 복사

}

// 데이터베이스에서 데이터 가져오기
$ sql = "SELECT * FROM users";
$result = $conn->query($sql);

// 데이터를 JSON 형식으로 변환
$data = array();
if ($result->num_rows > 0) {

while($row = $result->fetch_assoc()) {
    $data[] = $row;
}
로그인 후 복사

}

$jsonData = json_encode($data);
echo $jsonData;

// 데이터베이스 연결을 닫습니다
$conn->close();
?>

The 위의 코드는 먼저 데이터베이스에 연결하고 "users" 테이블의 데이터를 얻습니다. 그런 다음 루프를 통해 각 데이터 행을 배열에 추가합니다. 마지막으로 json_encode() 함수를 통해 배열을 JSON 형식으로 변환하고 JSON 문자열을 출력합니다.

  1. 프런트 엔드 코드는 JSON 데이터를 구문 분석하고 HTML 테이블을 생성합니다.

프런트 엔드 페이지에서는 JavaScript를 사용하여 백엔드에서 얻은 JSON 데이터를 구문 분석하고 HTML 테이블로 변환할 수 있습니다.



<meta charset="UTF-8">
<title>JSON to HTML</title>
로그인 후 복사


<table id="usersTable">
    <thead>
        <tr>
            <th>ID</th>
            <th>姓名</th>
            <th>年龄</th>
        </tr>
    </thead>
    <tbody>
    </tbody>
</table>

<script>
    // 获取JSON数据
    fetch('get_data.php')
        .then(response => response.json())
        .then(data => {
            // 解析JSON数据并生成HTML表格
            const tableBody = document.querySelector('#usersTable tbody');
            data.forEach(row => {
                const tr = document.createElement('tr');
                tr.innerHTML = `
                    <td>${row.id}</td>
                    <td>${row.name}</td>
                    <td>${row.age}</td>
                `;
                tableBody.appendChild(tr);
            });
        });
</script>
로그인 후 복사


위 코드는 먼저 빈 HTML 테이블을 생성하고 헤더를 설정합니다. 그런 다음 PHP 스크립트에서 반환된 JSON 데이터를 가져오고 fetch() 함수를 사용하여 JavaScript 개체로 구문 분석합니다. 그런 다음 forEach()를 사용하여 각 데이터 행을 반복하고 createElement() 함수를 사용하여 HTML 테이블의 행을 만듭니다. 마지막으로 데이터의 각 행 값을 해당 셀에 추가하고 해당 행을 테이블에 추가합니다.

위 단계를 통해 MySQL 데이터베이스의 데이터를 PHP 및 JSON 형식을 통해 HTML 테이블로 성공적으로 변환하고 프런트엔드 페이지에 표시했습니다.

요약:

이 글에서는 PHP와 MySQL을 사용하여 JSON 데이터를 HTML 형식으로 변환하는 방법을 소개하고 해당 코드 예제를 제공합니다. 이렇게 하면 백엔드에서 데이터를 쉽게 가져와 프런트엔드 페이지의 읽기 쉬운 테이블에 표시할 수 있습니다. 이 기사가 웹 개발에서 JSON 데이터를 처리하고 HTML 테이블을 생성하는 데 도움이 되기를 바랍니다.

위 내용은 PHP 및 MySQL을 사용하여 JSON 데이터를 HTML 형식으로 변환하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿