javascript - 为什么我的 appendChild 不起作用？

Question

function purchase()
{
    var r=document.createElement('div');
    r.className="row";
    alert(r);
    var p=document.createElement('div');
    p.className="purchase-hero-unit";
    alert(p);
    var span1=document.createElement('div');
    span1.className="span3";
    span1.textContent="&nbsp";
    alert(span1);
    var span2=document.createElement('div');
    span2.className="span6";
    alert(span2);
    var span3=document.createElement('div');
    span3.className="span3";
    span3.textContent="&nbsp";
    alert(span3);
    var price=document.getElementById('pPrice').value;
    var name=document.getElementById('pName').value;
    var s=": $";
    var h=document.createElement('h3');
    h.textContent=price+s+name;
    alert(h);
    p.appendChild(h);
    span2.appendChild(p);
    r.appendChild(span1);
    r.appendChild(span2);
    r.appendChild(span3);
    var d=document.getElementById('spendingContainer');
    d.appendChild(r);
    alert(d);
}

这是我将两个文本框的输入附加到 Twitter Bootstrap 英雄单元的功能。 spendingContainer 基本上只是一个容器，任何 __-hero-unit 基本上都是一个 hero-unit。如果有人可以帮助修复它，将不胜感激。谢谢。

JSfiddle 输出:

{"error": "Shell form does not validate{'html_initial_name': u'initial-js_lib', 'form': <mooshell.forms.ShellForm object at 0xa69168c>, 'html_name': 'js_lib', 'html_initial_id': u'initial-id_js_lib', 'label': u'Js lib', 'field': <django.forms.models.ModelChoiceField object at 0xa6912ec>, 'help_text': '', 'name': 'js_lib'}{'html_initial_name': u'initial-js_wrap', 'form': <mooshell.forms.ShellForm object at 0xa69168c>, 'html_name': 'js_wrap', 'html_initial_id': u'initial-id_js_wrap', 'label': u'Js wrap', 'field': <django.forms.fields.TypedChoiceField object at 0xa69128c>, 'help_text': '', 'name': 'js_wrap'}"}

我的控制台说:

[18:03:21.744] ReferenceError: reference to undefined property a[o] @ http://html5shim.googlecode.com/svn/trunk/html5.js:5

和:

[18:03:21.744] TypeError: variable b redeclares argument @ http://html5shim.googlecode.com/svn/trunk/html5.js:9

Answer 1

这些线路有问题:

p.innerHTML=h;
span2.innerHTML=p;
r.innerHTML=span1+span2+span3;

innerHTML 包含 HTML 字符串，而不是元素。您还需要在那里使用 appendChild:

p.appendChild(h);
span2.appendChild(p);
r.appendChild(span1);
r.appendChild(span2);
r.appendChild(span3);