首页 > 解决方案 > 我怎样才能使这个 ajax 代码适用于任何类型的 html 文件

问题描述

我有一个ajax调用,它将从数据库中获取一些数据,我必须将它们加载到一个 html 文件中。但是,问题是我有不同的 html 文件,我不知道 html 文件的内容

我已经尝试了大约 2-3 天,并搜索了将数据附加到 html 文件的不同方法。我对代码进行了一些更改。请假设代码工作正常。谢谢你。

  $.ajax({
            type: "GET",
            url:  "api/dataFromDataBase",
            success: function (data) {
                tableHead = data[0].split("?");//contains data from database
                $("#databaseContent").append("<tr>");
                for (var i = 0; i < 80; i++) {
                    $("#databaseContent").append("<th>" + tableHead[i] + "</th>");
                }
                $("#tableHeading").append("</tr>");
                tableHead += data[0]; 
                $("#FromHtml").append(data[1]);
            },   
        });

在这个文件中#databaseContent是 html 中的id,所以我可以轻松地附加数据。但我不知道 html 包含什么。他们有什么办法可以将数据附加到它吗?

标签: javascripthtmlajax

解决方案


如果您在成功的 Ajax 调用上没有注入点。您可以将整个表格附加到 html 页面的末尾。

// all of this within the success call of the AJAX
var tableHead = data[0].split("?");//contains data from database
var tableEle = document.createElement("table");
var tableBody = document.createElement("tbody");

var tableTr = document.createElement("tr");
for (var i = 0; i < 80; i++) {
  var cell = document.createElement("th");
  var cellText = document.createTextNode(tableHead[i]);
  cell.appendChild(cellText);
  row.appendChild(cell);
}
tableBody.appendChild(tableTr);
tableEle.appendChild(tableBody);
document.body.appendChild(tableEle);

我们在这里尝试做的是,创建一个表格元素并在循环中创建表格的内容,最后我们将新创建的表格附加到“document.body”。这应该适用于所有 html,因为所有 html 页面都有一个 body 标签。


推荐阅读