Question

所以我正在尝试制作一个简单的评论页面，但我似乎无法使其工作：/代码有问题吗？我正在尝试仅使用javascript，因为我还没有学过JQuery

function action(){

    var input = document.getElementById('header').value;
    localStorage.setItem('comment',input);
    document.getElementById('header').value=" ";
    var getInput = localStorage.getItem('comment');
    var date = Date();
    var parag = document.createElement('P')
    parag.innerText=getInput;
    document.getElementById('hello').appendChild=parag;

 }
 <textarea id='header' type='text' rows='6' cols='100' name='server'>
 </textarea>
 <input onclick="action();" type="button" value='Comment'>
 <span id='hello'></span>

Answer 1

document.getElementById('hello').appendChild=parag;

您没有正确调用appendChild函数。你正在分配。你应该做

 document.getElementById('hello').appendChild(parag);

注意：在以下代码中，由于安全问题，我删除了本地存储。

-

function action(){

    var input = document.getElementById('header').value;
    //localStorage.setItem('comment',input);
    document.getElementById('header').value=" ";
   // var getInput = localStorage.getItem('comment');
    var date = Date();
    var parag = document.createElement('P')
    parag.innerText="getInput";
    document.getElementById('hello').appendChild(parag);

 }

 <textarea id='header' type='text' rows='6' cols='100' name='server'>
 </textarea>
 <input onclick="action();" type="button" value='Comment'>
 <span id='hello'></span>

Answer 2

只需更改您将孩子附加到：

document.getElementById('hello').appendChild(parag);

<!DOCTYPE html>
<html>

  <head>
    <link rel="stylesheet" href="style.css">
    <script src="script.js"></script>
  </head>

<script type="text/javascript" charset="utf-8">
  function action(){
    var input = document.getElementById('header').value;
    localStorage.setItem('comment',input);
    document.getElementById('header').value=" ";
    var getInput = localStorage.getItem('comment');
    var parag = document.createElement('P')
    parag.innerText=getInput;
    document.getElementById('hello').appendChild(parag);

 }

</script>
  <body>
 <textarea id='header' type='text' rows='6' cols='100' name='server'>
 </textarea>
 <input onclick="action();" type="button" value='Comment'>
 <div id='hello'></div>
 </body>

</html>

Answer 3

Node.appendChild的语法错误。

您可以在DOM Living Standard。

中查看如何使用它

appendChild（node）方法在调用时必须返回将节点附加到上下文对象的结果。

您还应该考虑保留对标头的引用，而不是两次查询DOM。

不能将创建的段落元素放入div中？

3 个答案: