Javascript 将映射连接到循环的json文件

这可能是一个非常简单的问题，但我似乎在任何地方都找不到答案或解释

如何以及在何处连接地图（图像文件来自何处） 对于放置在JSON中的图像和名称，对于需要在浏览器窗口中显示的图像。 我对JSON、循环和JS非常陌生

这是我的代码，如果你需要查看它，了解我是如何制作的

JSON

//JavaScript
var jsonData=“noJson”；
var hr=新的XMLHttpRequest（）；
$（文档）.ready（函数（）{
var jsonData='空'；
$.ajax({
async:false，
url:“./js/data.json”，
数据类型：“html”，
成功：功能（响应）{
jsonData=JSON.parse（响应）；
console.log（'ok'）；
imagesJ=jsonData.main_object.imagesJ；
woorden=jsonData.main_object.woorden；
对于（i=0；i/img/[imagesJ[x]].jpg
}
},
错误：函数（）{
log（'无法加载JSON'）；
}
});
console.log（jsonData）；
});

梦游德拉赫特
如果我没弄错的话，您只需创建一个“img”元素，设置其“src”属性并附加到“images”节点

以下是你可以做到这一点的方法

var titles = ["words", "not", "needed", "yet"];
var imagesContainer = document.getElementById('images');

titles.forEach(function(title){
    var img = document.createElement('img');
    img.src = '/img/' + title + '.jpg';
    imagesContainer.appendChild(img);
});

例如：

已编辑：

举个具体的例子：

$.ajax({
     async: false,
     url: "./js/data.json",
     dataType: 'html',
     success: function(response) {
       jsonData = JSON.parse(response);
       console.log('ok');
       imagesJ = jsonData.main_object.imagesJ;
       woorden = jsonData.main_object.woorden;

       var imagesContainer = document.getElementById('images');
       for (i = 0; i < imagesJ.length; i++) {
         var img = document.createElement('img')
         img.src = '/img/' + imagesJ[i];
         imagesContainer.appendChild(img);
       }
    },

$.ajax({
async:false，
url:“./js/data.json”，
数据类型：“html”，
成功：功能（响应）{
jsonData=JSON.parse（响应）；
console.log（'ok'）；
imagesJ=jsonData.main_object.imagesJ；
woorden=jsonData.main_object.woorden；
var imagesContainer=document.getElementById（'images'）；
对于（i=0；i
如果我没弄错的话，您只需创建一个“img”元素，设置其“src”属性并附加到“images”节点

以下是你可以做到这一点的方法

var titles = ["words", "not", "needed", "yet"];
var imagesContainer = document.getElementById('images');

titles.forEach(function(title){
    var img = document.createElement('img');
    img.src = '/img/' + title + '.jpg';
    imagesContainer.appendChild(img);
});

例如：

已编辑：

举个具体的例子：

$.ajax({
     async: false,
     url: "./js/data.json",
     dataType: 'html',
     success: function(response) {
       jsonData = JSON.parse(response);
       console.log('ok');
       imagesJ = jsonData.main_object.imagesJ;
       woorden = jsonData.main_object.woorden;

       var imagesContainer = document.getElementById('images');
       for (i = 0; i < imagesJ.length; i++) {
         var img = document.createElement('img')
         img.src = '/img/' + imagesJ[i];
         imagesContainer.appendChild(img);
       }
    },

$.ajax({
async:false，
url:“./js/data.json”，
数据类型：“html”，
成功：功能（响应）{
jsonData=JSON.parse（响应）；
console.log（'ok'）；
imagesJ=jsonData.main_object.imagesJ；
woorden=jsonData.main_object.woorden；
var imagesContainer=document.getElementById（'images'）；
对于（i=0；i
听起来您想要为
imagesJ
中的每个图像添加一个for。循环的结构非常适合于此，您可以使用image标记来
div id=“images”
。for循环的外观如下所示：

for (i = 0; i < imagesJ.length; i++) {
    var path = imagesJ[i] + '.jpg';
    $('#images').append('<img id="image' + i + '" src="' + path + '" />');
}

for（i=0；i
听起来您想要为
imagesJ
中的每个图像添加一个for。循环的结构非常适合于此，您可以使用image标记来
div id=“images”
。for循环的外观如下所示：

for (i = 0; i < imagesJ.length; i++) {
    var path = imagesJ[i] + '.jpg';
    $('#images').append('<img id="image' + i + '" src="' + path + '" />');
}

for（i=0；i
它确实在这方面帮了我很大的忙，尽管var titles=[“words”、“not”、“needed”、“yet”]；必须在那里？因为我已经在jason中有了数组，难道不可能将它们保留在JSON中，但也保留在JS中吗？我确实尝试过，就像你所说的那样，但它不起作用..我只是想告诉你如何生成新图像并将它们附加到指定的节点；例如，你可以在“For”中进行操作循环。让我编辑我的答案来帮助你。虽然var titles=[“words”、“not”、“needed”、“yet”]这样做，但它确实在路上帮了我很大的忙；必须在那里？因为我已经在jason中有了数组，难道不可能将它们保留在JSON中，但也保留在JS中吗？我确实尝试过，就像你所说的那样，但它不起作用..我只是想告诉你如何生成新图像并将它们附加到指定的节点；例如，你可以在“For”中进行操作循环。让我编辑我的答案来帮助你谢谢你，你也帮助我理解了我需要如何、什么以及在哪里做这件事！谢谢你，你也帮助我理解了我需要如何、什么以及在哪里做这件事！