Question

我正在尝试动态地将新元素添加到我的html中。但我目前陷入“第二级”。它从一个div开始，新元素将存储在：

<div id="inputquestions"></div>

当我点击一个按钮时，新元素将通过javascript函数添加到div中，该函数看起来像这样

function addQuestion() {
        var div = document.createElement('div');

        questionID++; // increment questionID to get a unique ID for the new element

        div.className = 'newQuestion';

        div.id = 'newQuestionID';

        div.innerHTML =
            "<div class='input-group'>" +
            "<input id='question-" + questionID + "' class='form-control' name='questionbox' type='text' placeholder='New Question'/>" +
            "<button class='btn btn-secondary' onclick='removeQuestion(this.parentNode)' type='button'>Remove</button>" +
            "</div>" +
            "<div class='btn-group' role='group' aria-label='Basic example'>" +
            "<button class='btn btn-secondary' onclick='addRadioButton()' type='button'>+ Radiobutton</button>" +             
            "</div>";

        document.getElementById('inputquestions').appendChild(div);
    }

这将在第一个div中创建多个div，我现在希望每个div为它们单独创建新的div，但无法弄清楚如何做到这一点。我的函数addRadioButton()如何使新的div显示在div中我按下按钮？

Answer 1

在您的函数addRadioButton()中，您可以查看event.target.parentElement以获取包含点击的<div>的{{1}}。

然后将新元素添加到<button>。

Javascript：添加和删除元素到dom

1 个答案: