javascript - 使用 for 循环在 javascript 中动态创建按钮,并分配属性。

标签 javascript html setattribute createelement

我正在尝试使用下面的代码将按钮添加到我的页面主体中,按钮出现了,但是没有显示任何属性,它是一个默认按钮,没有随着字体大小的增加而增加,没有显示文本,没有颜色。

function createKeyboard()
	{
	   var str = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
	   for(var i=0; i<str.length; i++)
	   {
	    var nextChar = str.charAt(i);
	    var btn = document.createElement("BUTTON");
    	btn.setAttribute("id","btn"+nextChar);
    	btn.setAttribute("innerHtml",nextChar);
    	btn.setAttribute("value",nextChar);
    	btn.setAttribute("text",nextChar);
    	btn.setAttribute("font-size","14px");
    	btn.setAttribute("background-color","#4CAF50");
    	document.body.appendChild(btn);
    	}
    };

当使用控制台查看按钮时,我可以看到属性在那里,如下所示:

    <button id="btnA" innerhtml="A" value="A" text="A" font-size="14px"        background-color="#4CAF50"></button>

不确定我哪里出错了,有什么想法吗?

-谢谢

最佳答案

一切都不是属性,特别是 innerHTML。

btn.setAttribute("style","font-size:14px;background-color: #4CAF50");
btn.innerHTML = "A"

关于javascript - 使用 for 循环在 javascript 中动态创建按钮,并分配属性。,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41993471/

相关文章:

javascript - 如何从快速后端服务器获取图像并将其显示到 React js 前端?

javascript - 更改类 IF 下拉列表和 H2 内容与 Animate.css 匹配某些条件

html - 一个不能被打破的div

Javascript:setAttribute 有效,getAttribute 失败

javascript - 如何让异步ajax请求真正异步?

javascript - 如何使用 jsGrid 将项目获取到字段中的下拉列表?

html - CSS中的 `lightgrey`和 `lightgray`有什么区别?

python - Python 中的 __setattr__ 函数

javascript - 如何使用javascript更改css img元素

javascript - 如何设置输入文本字段的默认光标属性?