使用HTML和Javascript进行评论

Question

我有一个在HTML和Javascript中创建类似注释框的任务如何使用按钮删除来删除注释？ 还是我应该在此任务中使用链表？ 这是我的代码：

<html>
    <body>
        <div id='container'>
            <textarea id='txt'></textarea><br/>
            <button type='button' onclick="add()">Enter</button>
            <div id='contents'></div>
        </div>

        <script>
            function add(){
                var txt= document.getElementById('txt').value;
                var content= document.getElementById('contents');
                var tes= '<hr/><span>'+txt+"</span><button type='button'>delete</button>";
                content.innerHTML+=tes;
            }
        </script>
    </body>
</html>

Answer 1

为了快速回答这个问题，如果您想使用纯JavaScript，可以使用其Parent从DOM中删除元素，并通过id查看此Remove元素

附注：您是否不需要一种将注释存储在某处的方法（数据库？）

PS2您应该避免在分配给变量的字符串中直接使用html标记。 也许您应该看看网络上的一些最佳实践（关于DOM操作，jQuery clone（）方法等）

希望能帮助到你

Answer 2

在我看来，您不必担心持久化数据。 因此最快的解决方法是：

   <script>
            var arr = 1;
            function del(comm_id){
               var dom =document.getElementById(comm_id);
               dom.parentNode.removeChild(dom);
            }

        function add(){
            var txt= document.getElementById('txt').value;
            var content= document.getElementById('contents');
            var comm_id="comment"+arr;
            var del_id="delete"+arr;
            var tes= "<div id="+comm_id+">"+'<hr/><span>'+txt+"</span><button type='button' id="+ del_id + ">delete</button></div>";
            content.innerHTML+=tes;
             document.getElementById(del_id).setAttribute('onclick',"del('"+comm_id+"')");
            arr++;
        }
    </script>

Answer 3

为此，无需实现链接列表。 您可以在javascript中使用Array。 无需预先定义数组的大小。 您可以在其中添加任意数量的元素。

要删除特定元素，您可以利用

array.splice(i, 1);

这将删除第ith个元素。

使用HTML和Javascript进行评论

问题描述

3 个解决方案

解决方案1
0 2014-03-10 05:05:53

解决方案2
0 2014-03-10 05:10:16

解决方案3
0 2014-03-10 05:20:57

使用HTML和Javascript进行评论

问题描述

3 个解决方案

解决方案1 0 2014-03-10 05:05:53

解决方案2 0 2014-03-10 05:10:16

解决方案3 0 2014-03-10 05:20:57

解决方案1
0 2014-03-10 05:05:53

解决方案2
0 2014-03-10 05:10:16

解决方案3
0 2014-03-10 05:20:57