javascript - 将文本发布到父元素，并可以选择删除发布的元素 - Javascript

有几件事我需要帮助。我在堆栈溢出上找到了一些解决方案，但无法将它们全部放在一起。

我希望用户将文本添加到文本区域，单击按钮将文本发布到父元素，最后可以选择从父元素中删除发布的文本元素。据我所知，这是代码。预先感谢您的任何建议。

<body>

<h4>A News Module.</h4>

<div id="container">
  <p>Here is some news.<a href="#" onclick="deleteNews()"></a></p>
</div>

<textarea id="alltext" rows="13" cols="53" placeholder="Add your news here."></textarea>
<br>
<input type="button" value="Submit News" onclick="addNews()">

<script>

    function addNews(){

      var addEl = document.createElement('p');

      document.getElementById('container').appendChild(addEl);
     }

    function deleteNews(){

      var deleteEl = document.getElementById('container');

      deleteEl.parentNode.removeChild(deleteEl);

     }

</script>
</body>

也在 jsfiddle 上:https://jsfiddle.net/lotus89/nvo1s5re/

最佳答案

有两件事。

1) 您需要将文本框中的文本添加到新创建的元素中。创建后添加以下行:

addEl.textContent = document.getElementById('alltext').value;

这会获取文本框的值并将其设置为新创建元素的文本内容。

2) addNews() 需要位于 jsfiddle 的全局范围内添加这一行:

window.addNews = addNews;

编辑:更新 fiddle - https://jsfiddle.net/rtj998gL/1/

关于javascript - 将文本发布到父元素，并可以选择删除发布的元素 - Javascript，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39417280/