动态添加文本输入字段答案

【问题标题】：Dynamically adding text input fields动态添加文本输入字段
【发布时间】：2018-04-29 23:19:35
【问题描述】：

我是 Javascript 和 Jquery 的新手，正在尝试学习如何动态添加我的 html 中的元素。

我的 HTML：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Academic Calculator</title>
    <meta name="Calculator" content="Academic Calculator">
    <link rel="stylesheet" href="Calculate.css">

</head>
<body>
    <script src="CalculatorLogics.js"></script>
    <div>
        <form>
                First Name:<br>
                <input name="first-name">
                <br>
                Last Name:<br>
                <input name="last-name">
                <br>
            <hr>
        </form>
    </div>
    <div class="courses">
        <button type="button" onclick="createNewCourses()">Add Course</button>
    </div>
</body>
</html>

还有我的 Javascript：

function createNewCourses() {
    $(".courses").append("<input type='text>");
}

【问题讨论】：

我知道有一个编辑被批准，但它通过修复问题使答案无效。因此，我已将其填满。

标签： javascript jquery html

【解决方案1】：

你犯了一个错误'text替换为"text"

function createNewCourses() {
    $('.courses').append('<input type="text">');
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>


   <div>
        <form>
                First Name:<br>
                <input name="first-name">
                <br>
                Last Name:<br>
                <input name="last-name">
                <br>
            <hr>
        </form>
    </div>

    <div class="courses">
        <button type="button" onclick="createNewCourses()">Add Course</button>
    </div>

【讨论】：