未捕获的TypeError:无法执行' appendChild' on'节点':参数1不是类型'节点'。在HTMLButtonElement.comm

时间:2017-07-31 16:52:01

标签: javascript

我是JavaScript的初学者,我想要输入两个输入并在底部屏幕上输入文本输入文本,就像应用程序JavaScript一样,但我收到了上述错误。 (见image

JS代码

var array=[];

function naam() 
{

var list = document.createElement("ul");        
var inputname=document.getElementById("nameplace").value;     
   list.innerText=inputname;    
    array.push(list);    
    if (inputname ==""|| inputname == " "){    
        alert("kuch tu likho");
    }    
    else {    
        var naam1= document.getElementById("naamprint");    
        naam1.appendChild(list);    
    }
}


var array1=[];

function comm() {    
    var list1=document.createElement("ul");    
    var inputname1=document.getElementById("commentplace").value;    
    list1.innerText=inputname1;    
    array1.push(list1);    
    if (inputname1 =="" || inputname1 ==" "){
        alert("kuch to likho");
    }
    else {

        var naam2=document.getElementById("commentprint");    
        naam2.appendChild(comm);
    }
}

var action=document.getElementById("btn");    
action.onclick=naam;    
action.onclick=comm;

HTML

<p>Name <input type="text" id="nameplace"></p>
<p>Comment <input type="text" id="commentplace" ></p>
<button id="btn"> submit </button>
<p><b id="naamprint"></p></b>
<p><b id="commentprint"></p></b>
<script src="app.js"> </script>

1 个答案:

答案 0 :(得分:1)

快速回答

naam2.appendChild(comm); // error because comm is not an element that you can append

更改为

naam2.appendChild(list1);

另外,您定义了一个侦听器并重新定义了它

action.onclick=naam;    // this will never execute
action.onclick=comm;

更改为

action.addEventListener('click', naam);
action.addEventListener('click', comm);

更多评论:

一个。首先关闭内部标签

<p><b id="naamprint"></p></b> // change to </b></p>
<p><b id="commentprint"></p></b> // same situation

湾您可以简单地使用nameplace.value代替document.getElementById("nameplace").value,它适用于任何带ID的元素。例如这个

var naam2=document.getElementById("commentprint");    
naam2.appendChild(comm);

可简化为此

commentprint.appendChild(comm);

℃。 ul标签。

var list1=document.createElement("ul"); ul标记应包含li标记,而不是文字。

d。价值空间。这样:

if (inputname1 =="" || inputname1 ==" "){ ...

应该更好地改变

if (!inputname1.trim()){ ...