Question

我正在通过javascript设置按钮，但按钮不显示文字。

有关如何修复它的任何建议？

var b = document.createElement('button');
b.setAttribute('content', 'test content');
b.setAttribute('class', 'btn');
b.value = 'test value';

var wrapper = document.getElementById(divWrapper);
wrapper.appendChild(b);

谢谢！

Answer 1

基本上，使用innerHTML而不是value，因为你要附加的'button'类型会在innerHTML中设置它的值。

<强> JS：

var b = document.createElement('button');
b.setAttribute('content', 'test content');
b.setAttribute('class', 'btn');
b.innerHTML = 'test value';

var wrapper = document.getElementById("divWrapper");
wrapper.appendChild(b);

在DOM中看起来像这样：

<div id="divWrapper">
    <button content="test content" class="btn">test value</button>
</div>

演示： http://jsfiddle.net/CuXHm/

Answer 2

button元素的值不是显示的文本，与类型按钮的input元素发生的情况相反。

你可以这样做：

 b.appendChild(document.createTextNode('test value'));

Demonstration

Answer 3

创建一个文本节点并将其附加到按钮元素：

var t = document.createTextNode("test content");
b.appendChild(t);

Answer 4

通过设置innerHTML

来设置按钮的文本

var b = document.createElement('button');
b.setAttribute('content', 'test content');
b.setAttribute('class', 'btn');
b.innerHTML = 'test value';

var wrapper = document.getElementById('divWrapper');
wrapper.appendChild(b);

http://jsfiddle.net/jUVpE/

通过javascript设置按钮文本

4 个答案: