javascript - 如何插入元素上使用纯 JavaScript

Question

我遇到了 javascript 的问题，我不知道如何解决它...实际上我的代码在 jsfiddle 上运行良好，但是当我尝试在我的 HTML 页面上插入时，它就不再工作了...我是什么想要的，是每次我尝试点击名为“添加”的按钮时，在 <ul> 上添加 <li> ！

HTML 代码：

....
<td width="50%" valign="top">
                    <b> SUPER: </b>
                    <ul id="ul">

                    </ul>
</td>
....
<input type="submit" value="Add" onclick="add()"/>
....

JavaScript 代码：

<script type="text/javascript">
                        function add(){
                            var ul = document.getElementById("ul");
                            var li = document.createElement("li");
                            li.innerHTML = "LoL";
                            ul.appendChild(li);
                    }
 </script>

该代码的结果：当我尝试点击按钮时，它不会在我的 HTML 页面上添加任何内容......谢天谢地，

Answer 1

可能过于简单化了，但这里有一个想法：您的输入按钮是一个提交，所以当 onClick 执行时，提交立即发生，将页面恢复到其原始状态。这个过程发生得如此之快，看起来代码什么也没做。

只需将输入类型更改为“按钮”，例如

<input type="button">