javascript - 如何将元素附加到 getElementsByClassName 提取的父元素？

Question

下面是我的JSP代码，

<%
    while(resultSet1.next()){
                        out.println("<p class='comm'>");
                        out.println(resultSet1.getString("answer_content"));
                        out.println("</p>");

                    }
%>

下面是我用过的脚本，

<script>

            $( document ).ready(function() {

                var par = document.getElementsByClassName("comm");

                var insert = document.createElement("form");
                insert.setAttribute("action","ForumSubmitCommentController");

                var text = document.createElement("input");
                text.setAttribute("type","text");
                text.setAttribute("name","comm_text");
                text.setAttribute("id","comm_text");
                insert.appendChild(text);

                var comm_submit = document.createElement("input");
                comm_submit.setAttribute("type","submit");
                comm_submit.setAttribute("value","Comment");
                insert.appendChild(comm_submit);

                par.appendChild(insert);

           });

        </script>

我希望得到一个附加到所有带有“class='comm'”的“p”元素的表单，但我什么也没得到。那么任何人都可以指出我做错了什么吗？提前致谢。

Answer 1

因为par是一个数组，所以没有appendChild方法

$(document).ready(function () {
    $('.comm').each(function () {
        var insert = document.createElement("form");
        insert.setAttribute("action", "ForumSubmitCommentController");

        var text = document.createElement("input");
        text.setAttribute("type", "text");
        text.setAttribute("name", "comm_text");
        text.setAttribute("id", "comm_text");
        insert.appendChild(text);

        var comm_submit = document.createElement("input");
        comm_submit.setAttribute("type", "submit");
        comm_submit.setAttribute("value", "Comment");
        insert.appendChild(comm_submit);

        this.appendChild(insert);

    })
});

演示:Fiddle

---

但更简单的方法是使用

$(document).ready(function () {
    var form = '<form action="ForumSubmitCommentController"><input type="text" name="comm_text" id="comm_text"><input type="submit" value="Comment"></form>';

    $('.comm').append(form)
});

演示:Fiddle