通过javascript对象循环后动态创建文本框

我有一个javascript，它通过ajax请求向服务器发送一些信息，并接收一些数据作为问题，而他们的ID作为json数组

这就是我从服务器收到的json数组响应的样子：

   [
     {
      "ID":"1",
      "question":"Write a function called addNum. "
        },
     {
      "ID":"3",
      "question":"Write a function called sumDouble "
      }
    ]

这是javascript：

$(document).ready(function(){
    $("form#input_qnumber").submit(function() {

    var questions = $('#questions').attr('value'); // written question
    var quizname = $('#quizname').attr('value');

    if (questions) { // values are not empty
        $.ajax({
            type: "POST",
            url: "https://xxxx",
            contentType: "application/x-www-form-urlencoded; charset=utf-8",
            dataType: "application/json",
            data: 'questions='+questions+'&quizname='+quizname,

            success: function (data) 
            {
                var JSONObject = JSON.parse(data); 

                for (var key in JSONObject) {
                    if (JSONObject.hasOwnProperty(key)) {
                        console.log(JSONObject[key]["ID"] + ", " + JSONObject[key]["question"]);
                    }
                }



            }

        });
    }
    else {
        $('div#createquizresp').text("Enter question ID's separated by a comma to be included in the quiz");
        $('div#createquizresp').addClass("error");
    } // else
    $('div#createquizresp').fadeIn();
    return false;
});
});

---

如您所见，我可以将响应json解析为javascript对象数组，循环并在控制台中转储内容。但我希望创建textarea元素，将数组中的'id'键赋予其id属性，并使用数组中相应的问题键对其进行标记。在此之后，我可以将元素附加到html中的div中。但我真的不知道该怎么做，也不知道这是否可能。请停下来

如果还需要标签元素

for (var key in JSONObject) {
    if (JSONObject.hasOwnProperty(key)) {
        $('<label>')
            .attr('for', JSONObject[key]["ID"])
            .html(JSONObject[key]["question"])
            .appendTo('wherever_you_want');
        $('<textarea>')
            .attr('id', JSONObject[key]["ID"])
            .appendTo('wherever_you_want');
    }
}

for（JSONObject中的var键）{
if（JSONObject.hasOwnProperty（键））{
$('')
.attr（'for'，JSONObject[key][“ID”]）
.html（JSONObject[key][“问题”]）
.appendTo（'你想去哪里'）；
$('')
.attr（'id'，JSONObject[key][“id”]）
.appendTo（'你想去哪里'）；
}
}

创建动态元素输入和标签，然后将这些元素附加到父div或符合您要求的正文中

演示：

var textbox=document.createElement（'input'）；
setAttribute（“id”，JSONObject[key][“id”]）；
var labell=document.createElement（'label'）；
setAttribute（“for”，JSONObject[key][“question”]）；
labell.innerHTML=JSONObject[key][“question”]；
document.getElementById（'display'）.appendChild（文本框）；
document.getElementById（'display'）.appendChild（labell）；

基恩的回答非常完美。一个建议是，给外国ID加一个前缀。为了安全起见，您还可以将ID分配给其他类型的元素（即答案）

for（JSONObject中的var键）{
if（JSONObject.hasOwnProperty（键））{
$（“#提问问题”）
.append（$（''）
.attr（'for'，'Q'+JSONObject[key][“ID”]）
.html（JSONObject[key][“question”]）
.append（$（''）
.attr（'id'，'Q'+JSONObject[key][“id”]））
}
}

这是一个完美的问题，但是，有没有一种方法可以先通过这个创建一个表单，然后将它附加到div，然后将该表单中的所有元素附加到该表单中。

<div id ="display"></div>

<script>
var textbox = document.createElement('input');
textbox.setAttribute("id", JSONObject[key]["ID"]);
var labell = document.createElement('label');
labell.setAttribute("for",JSONObject[key]["question"]);
labell.innerHTML = JSONObject[key]["question"];

document.getElementById('display').appendChild(textbox);
document.getElementById('display').appendChild(labell);
</script>

for (var key in JSONObject) {
    if (JSONObject.hasOwnProperty(key)) {
        $('#quizquestions')
            .append($('<label>')
                .attr('for', 'Q' + JSONObject[key]["ID"])
                .html(JSONObject[key]["question"]))
            .append($('<textarea>')
                .attr('id', 'Q' + JSONObject[key]["ID"]))
    }
}