$.getJson 函数未附加到 div
$.getJson function not appending to div
所以我试图从提供给我的 JSON 文件中获取 .json 数据,遍历它,每次创建一个 div 并将该数据附加到它.
到目前为止我有这个功能:
$.getJSON( "https://api.myjson.com/bins/14uau1", function(data) {
var dealers = data.dealers.map(dealer => {
let currentDealer = dealer.data;
let newDiv = document.createElement("div");
newDiv.setAttribute("id", currentDealer.customerID);
return newDiv.innerHTML= currentDealer;
})
dealers.map(i => {
let holder = document.getElementById("dealer");
holder.appendChild(i);
console.log(i);
})
但是,每当我尝试 运行 它时,它都会给我这个错误
index:212 Uncaught TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node
我意识到这意味着它正在获取一个不被视为 HTML 元素的对象,因此无法通过 .innerHTML.[= 将其附加到 div 中13=]
那么最好的方法是什么?
首先,您的代码中存在一些语法错误。
缺少一个 })
,您需要处理。
return newDiv.innerHTML = currentDealer
这一行 returns 是一项作业,而不是您可能想要的 newDiv
。相反,您应该在返回元素 ( return newDiv
) 之前先分配 innerHTML ( newDiv.innerHTML = <value>
)。这是您收到 uncaught TypeError
错误的地方。
您还将 Javascript 对象 (currentDealer
) 而不是字符串分配给 innerHTML。如果你想输出这个对象的JSON字符串,使用JSON.stringify
。否则,请确保您正在分配所需的实际字段,例如currentDealer.data.companyID
。
另请注意,在这一行 newDiv.setAttribute("id", currentDealer.customerID);
中,您正在尝试分配 currentDealer.customerID
,这是一个未定义的值。
综上所述
- 首先,检查语法错误
- 然后,检查您分配的值是否存在(
console.log
和 console.dir
是您的朋友)并匹配您尝试分配给 [=46= 的 data type ]
这是一个工作演示:
https://codepen.io/hydrospell/pen/KvRgvB
所以我试图从提供给我的 JSON 文件中获取 .json 数据,遍历它,每次创建一个 div 并将该数据附加到它.
到目前为止我有这个功能:
$.getJSON( "https://api.myjson.com/bins/14uau1", function(data) {
var dealers = data.dealers.map(dealer => {
let currentDealer = dealer.data;
let newDiv = document.createElement("div");
newDiv.setAttribute("id", currentDealer.customerID);
return newDiv.innerHTML= currentDealer;
})
dealers.map(i => {
let holder = document.getElementById("dealer");
holder.appendChild(i);
console.log(i);
})
但是,每当我尝试 运行 它时,它都会给我这个错误
index:212 Uncaught TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node
我意识到这意味着它正在获取一个不被视为 HTML 元素的对象,因此无法通过 .innerHTML.[= 将其附加到 div 中13=]
那么最好的方法是什么?
首先,您的代码中存在一些语法错误。
缺少一个 })
,您需要处理。
return newDiv.innerHTML = currentDealer
这一行 returns 是一项作业,而不是您可能想要的 newDiv
。相反,您应该在返回元素 ( return newDiv
) 之前先分配 innerHTML ( newDiv.innerHTML = <value>
)。这是您收到 uncaught TypeError
错误的地方。
您还将 Javascript 对象 (currentDealer
) 而不是字符串分配给 innerHTML。如果你想输出这个对象的JSON字符串,使用JSON.stringify
。否则,请确保您正在分配所需的实际字段,例如currentDealer.data.companyID
。
另请注意,在这一行 newDiv.setAttribute("id", currentDealer.customerID);
中,您正在尝试分配 currentDealer.customerID
,这是一个未定义的值。
综上所述
- 首先,检查语法错误
- 然后,检查您分配的值是否存在(
console.log
和console.dir
是您的朋友)并匹配您尝试分配给 [=46= 的 data type ]
这是一个工作演示:
https://codepen.io/hydrospell/pen/KvRgvB