JavaScript表格数据保存到数据库：完整示例和安全注意事项

"要将表格数据保存到数据库，你需要使用后端语言来处理数据库操作。以下是一个基本的示例，使用JavaScript和PHP来保存表格数据到数据库：\n\nHTML部分：\n\nhtml\n<table id=\"myTable\">\n <tr>\n <th>Name</th>\n <th>Email</th>\n </tr>\n <tr>\n <td contenteditable=\"true\">John Doe</td>\n <td contenteditable=\"true\">john@example.com</td>\n </tr>\n <tr>\n <td contenteditable=\"true\">Jane Smith</td>\n <td contenteditable=\"true\">jane@example.com</td>\n </tr>\n</table>\n\n<button onclick=\"saveData()\">Save</button>\n\n\nJavaScript部分：\n\njavascript\nfunction saveData() {\n var table = document.getElementById(\"myTable\");\n var rows = table.rows;\n \n var data = [];\n \n for (var i = 1; i < rows.length; i++) { // Skip header row\n var name = rows[i].cells[0].innerText;\n var email = rows[i].cells[1].innerText;\n \n data.push({ name: name, email: email });\n }\n \n // Send data to backend\n var xhr = new XMLHttpRequest();\n xhr.open(\"POST\", \"save_data.php\", true);\n xhr.setRequestHeader(\"Content-Type\", \"application/json\");\n xhr.onreadystatechange = function() {\n if (xhr.readyState === 4 && xhr.status === 200) {\n alert(\"Data saved successfully\");\n }\n };\n xhr.send(JSON.stringify(data));\n}\n\n\nPHP部分（save_data.php）：\n\nphp\n<?php\n// Connect to database\n$servername = \"localhost\";\n$username = \"username\";\n$password = \"password\";\n$dbname = \"database_name\";\n\n$conn = new mysqli($servername, $username, $password, $dbname);\nif ($conn->connect_error) {\n die(\"Connection failed: \" . $conn->connect_error);\n}\n\n// Get data from request\n$data = json_decode(file_get_contents('php://input'), true);\n\n// Insert data into database\nforeach ($data as $row) {\n $name = $row[\"name\"];\n $email = $row[\"email\"];\n \n $sql = \"INSERT INTO table_name (name, email) VALUES ('$name', '$email')\";\n \n if ($conn->query($sql) !== true) {\n echo \"Error: \" . $sql . \"<br>\" . $conn->error;\n }\n}\n\n$conn->close();\n?>\n\n\n请注意，此示例中的数据库连接详细信息和表名应根据你自己的设置进行更改。此外，此示例中没有包含对用户输入进行验证和防止SQL注入的代码。在实际应用中，你应该对用户输入进行验证和转义，以保护数据库的安全性。\n