MySQL 및 JavaScript를 사용하여 동적 데이터 테이블을 만드는 방법
개요:
현대 웹 개발에서 동적 데이터 테이블은 매우 일반적인 구성 요소입니다. 데이터베이스 관리 시스템인 MySQL과 프런트엔드 프로그래밍 언어인 JavaScript를 사용하여 데이터베이스의 데이터를 표시하고 조작하기 위한 동적 데이터 테이블을 쉽게 생성할 수 있습니다. 이 기사에서는 MySQL과 JavaScript를 사용하여 동적 데이터 테이블을 생성하는 방법을 자세히 소개하고 구체적인 코드 예제를 제공합니다.
단계:
CREATE DATABASE my_database; USE my_database; CREATE TABLE my_table ( id INT PRIMARY KEY AUTO_INCREMENT, name VARCHAR(50), age INT, email VARCHAR(100) );
const mysql = require('mysql'); const connection = mysql.createConnection({ host : 'localhost', user : 'your_username', password : 'your_password', database : 'my_database' }); connection.connect((err) => { if (err) throw err; console.log('Connected to MySQL database'); });
위 코드의 your_username
및 your_password
를 실제 MySQL 사용자 이름과 비밀번호로 바꾸세요. your_username
和your_password
替换为实际的MySQL用户名和密码。
const sql = 'SELECT * FROM my_table'; connection.query(sql, (err, result) => { if (err) throw err; console.log('Fetched data from database:', result); // 将数据展示在表格中 const table = document.getElementById('data-table'); result.forEach((row) => { const newRow = table.insertRow(); Object.values(row).forEach((value) => { const cell = newRow.insertCell(); cell.innerHTML = value; }); }); });
在以上示例中,我们执行了一个简单的SELECT语句来获取数据库中的所有数据,并将其展示在一个id为data-table
的HTML表格中。
const sql = `INSERT INTO my_table (name, age, email) VALUES ('John', 25, 'john@example.com')`; connection.query(sql, (err, result) => { if (err) throw err; console.log('Inserted a new row into the database'); });
以上代码将在数据库的my_table
데이터베이스에 성공적으로 연결되면 JavaScript를 사용하여 데이터베이스의 데이터를 쿼리하고 데이터 테이블에 표시할 수 있습니다. 다음은 데이터베이스를 쿼리하고 데이터를 표시하는 간단한 샘플 코드입니다.
my_table
테이블에 새로운 데이터 행을 삽입합니다. 🎜🎜요약: 🎜MySQL과 JavaScript를 사용하면 쉽게 동적 데이터 테이블을 생성하고 데이터베이스의 데이터를 표시하고 조작할 수 있습니다. 이 문서에서는 데이터베이스 연결, 데이터 쿼리 및 기타 작업 수행에 대한 구체적인 코드 예제를 제공합니다. 이 문서가 동적 데이터 테이블을 개발할 때 모든 사람에게 도움이 되기를 바랍니다. 🎜위 내용은 MySQL과 JavaScript를 사용하여 동적 데이터 테이블을 만드는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!