Question

所以我想写出输入值项内的文本，并在文本右侧创建另一个节点。但是这个文本只是在输入文本旁边显示[object HTMLParagraphElement]，为什么它不显示文本？

我不知道自己做错了什么，请帮助我！

所以输入的文字显示但不是我制作的另一个p元素？

以下是代码：

   var lista = document.getElementById("lista");

var li = document.createElement("li");

var del = document.createElement("p");
var delt = document.createTextNode("remove this");
del.appendChild(delt);


var item = document.getElementById("item");

var text = document.createTextNode(item.value + " | " + del);


li.appendChild(text);
lista.appendChild(li);

Answer 1

您无需创建文本节点来附加文本。只需在您正在创建的元素上设置innerHTML：

var myPar = document.createElement('p');
myPar.innerHTML = "remove this";

li.innerHTML = myPar.outerHTML; //this would be the tag and its text <p>remove this</p>

// other code here.

演示Fiddle

Answer 2

问题在于行

var text = document.createTextNode(item.value + " | " + del);

此时，'del'引用了一个段落元素，你可以使用“del.innerHtml”而不是“del”

Answer 3

将代码更改为使用del.innerHTML。

var text = document.createTextNode(item.value + " | " + del.innerHTML);

document.createTextNode的参数必须是字符串。而innerHTML是元素对象的html代码。

Answer 4

http://jsfiddle.net/4YgXG/

HTML：

<ul id="lista"></ul>

JS：

// EXAMPLE!
var lista = document.getElementById("lista");
var item = document.getElementById("item");

for(var i=0;i<100;i++){
    var li = document.createElement("li");
    var del = document.createElement("p");
    del.innerHTML = 'Remove this';
    li.appendChild( del );
    lista.appendChild(li);
}

无法找到元素

4 个答案: