个人中心
gpt4 book ai didi

javascript - 使用 Node.js 在 html 表中显示 mysql

转载 作者：行者123 更新时间：2023-11-29 03:15:24 24 4
gpt4 key购买 nike

我正在学习如何将 node.js 与 mysql 结合使用。我试图找到一些好的文档但徒劳无功。我现在可以在我的浏览器中显示我的 mysql 数据，但我想在某个时候通过我的 index.html 和一个 css 文件来处理它。

这是我的 app.js:

// moduels
var express = require('express');
var app = express();
var mysql = require('mysql');
var bodyParser = require('bodyParser')

// 
app.use(express.static(__dirname + '/public'));
app.use(bodyParser.urlencoded({extended: false}));

// connect to database
var con = mysql.createConnection({
    host: "localhost",
    user: "root",
    password: "1234",
    database: "BathBombs_DB"
});

// routes
app.get('/', function(request, response){
    console.log('GET request received at /') 
    con.query("SELECT * FROM customers", function (err, result) {
        if (err) throw err;
        else{
            response.send(result)
        }

    });
});

// listen for trafic and display on localhost:9000
app.listen(9000, function () {
    console.log('Connected to port 9000');
});

我的 index.html 网站是这样的:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>

    <form action="/" method="POST">
            <table type="text" name="firstname" ></table>
    </form>

</body>
</html>

最佳答案

您必须进行 ajax 调用以从服务器获取结果并使用 javascript 绑定(bind) HTML 内容，如下所示:

HTML 模板

 <table id="tableData" class="table table-fixed">
<thead>
  <tr>
  </tr>
</thead>
<tbody class="tbody" >
</tbody>

这是进行ajax调用的脚本

$(document).ready(() => {

$.ajax({
    url: "http://localhost:9000/list", 
    method: 'GET',
    success: function(response){
        if(response.rows.length > 0){
            for(let index = 0; index < response.rows.length; index++) {
                var newRow = $("<tr>");
                var cols = "";
                var firstname = '';
                var lastname = '';
                var gender = '';
                cols += '<td> '+ response.rows[index].firstname +'</td>';
                cols += '<td> '+ response.rows[index].lastname +'</td>';
                cols += '<td> '+ response.rows[index].gender+'</td>';                
                newRow.append(cols);
                $("#tableData .tbody").append(newRow);
            }  

        }
    }
})
})

关于javascript - 使用 Node.js 在 html 表中显示 mysql，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/58992092/

24 4 0
文章推荐： java - 根据java中特定列中的值从sql数据库中选择一行
文章推荐： php - 来自主机名 "localhost"而不是容器名称的 php 容器的数据库连接
文章推荐： java - 回滚时取消 ejb 定时器
文章推荐： java - 有只写的 map 吗？
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com