Question

我在js中有一个来自php的变量，例如：

var myData = <?php echo json_encode($json_array) ?>;

，我正在尝试将此obj的键和值传递给javascript生成的表。控制台中的myData格式粘贴在下面。当我将其传递到表时，出现错误消息说它无法读取 myData。我知道我可以将数据作为对象传递，但由于我从php传入，而不像常规的json文件一样读取数据，因此在某种程度上这是不同的。我得到的错误是：未捕获的TypeError：无法读取null的属性“ insertRow” 在generateTable上？

控制台中的myData输出是什么：

0:
Carat: "0.70"
Clarity: "VVS2"
Color: "D"
Cut: "Very Good"
Polish: "Fair"
Price: "2806"
Product ID: "17"
Product Name: "0.7 Carat Cushion Diamond"
Report: "IGI"
Shape: "Cushion"
Symmetry: "Ideal"
purl: "http://klaussongs.com/product/0-7-carat-cushion-diamond/"
__proto__: Object
1: {Product ID: "19", Product Name: "0.9 Carat Round Diamond", Carat: "0.90", Clarity: "VS2", Shape: "Round", …}
2: {Product ID: "21", Product Name: "1 Carat Radiant Diamond", Carat: "1.00", Clarity: "SI1", Shape: "Radiant", …}
3: {Product ID: "23", Product Name: "1.15 Carat Princess Diamond", Carat: "1.15", Clarity: "IF", Shape: "Princess", …}

用于从myData生成表的函数：

function generateTableHead(table, data) {
          let thead = table.createTHead();
          let row = thead.insertRow();
          for (let key of data) {
            let th = document.createElement("th");
            let text = document.createTextNode(key);
            th.appendChild(text);
            row.appendChild(th);
          }
        }

        function generateTable(table, data) {
          for (let element of data) {
            let row = table.insertRow();
            for (key in element) {
              let cell = row.insertCell();
              let text = document.createTextNode(element[key]);
              cell.appendChild(text);
            }
          }
        }


        let table = document.querySelector("table");


        let data = Object.keys(myData);


        // generate cells from values
        generateTable(table, myData);


        // create heading from keys
        generateTableHead(table, data);

Answer 1

似乎let table = document.querySelector("table");返回null。您确定运行此查询时已创建表元素吗？您可以确认这返回null吗？

js生成的表中未显示json数据

1 个答案: