集成php和Javascript的最佳方式

Question

我有一个.php文件，其中运行了一些显示"卡片"的脚本。我展示了6张卡片，显示的文字是硬编码的。我已经准备好开始从我的数据库中提取并删除我的硬代码部分。

//Set number of cards to show
multiplyNode(document.querySelector('.card_content'), 6, true);  
var authors = ["Margaret", "Lucy", "Odessa", "Shifty", "Saggy", "Lady"];
var BookNumbers = [2563, 8547, 5896, 4157, 5823, 7963];
$(function(){box_title
//$(".card_content").clone(true).appendTo(".main_card_shell");
$('.box_title').each(function (i) { 
$(this).html("<div class='card_name'>" + authors[i] + "</div>" +
"<div class='card_number'>" + BookNumbers[i] +  "</div>" +
"<div class='tag_row'>" +
"<div class='sample_tag sample_tag4'></div>" +
"<div class='sample_tag sample_tag3'></div>" +
"</div>");
});
}) 

我知道我可以通过从数据库中提取我想要的数据

$result = $conn->query("SELECT `Author`, `Book_Num` FROM `Authors`");

但是，获得$result以替换硬编码的authors和BookNumbers数组的最佳方法是什么？

Answer 1

您可以循环遍历结果，构建一个与javascript数组结构相同的php数组，然后使用json_encode将其转换为javascript数组格式。

<script type='text/javascript'>
<?php
$result = $conn->query("SELECT `Author`, `Book_Num` FROM `Authors`");
// loop through the results to build the php arrays
while($row = $result->fetch_array())
{
// set the author and book number to array with numeric key
$authors[] = $row['Author'];
$BookNumbers[] = $row['Book_Num'];
}
// use json_encode to convert the php array to an javascript array
echo "var authors = ".json_encode($authors).";n";
echo "var BookNumbers = ".json_encode($BookNumbers).";n";
?>
</script>

注释：除非您需要交互性，否则您可以在不使用jquery 的情况下使用php构建html