将文本标签和/或图标附加到div

Question

我正在尝试创建一个div来容纳几个状态消息和/或图标，我正在使用dhtmlx，但是它应该适用于常规javascript / html / css。 StatusBar是浏览器的底行。

moUI.statusMain = moUI.layoutMain.attachStatusBar();     // Status bar initialization\setup
moUI.statusMain.id = "statusMain";
moUI.statusMain.setText("<div id=\"toolbarObj\"></div><div style=\"\"><textarea rows=\"1\" cols=\"20\" id=\"status_txt\" type=\"text\" value=\"Initializing.\"><textarea rows=\"1\" cols=\"20\" id=\"operation_txt\" type=\"text\" value=\"COPY\"></div>");

然后，我可以像这样修改文本

document.getElementById("status_txt").value = "Done.";

textarea的问题是第二个区域永远不会显示，它们有一个滚动条，如果用户单击该框，浏览器将崩溃。 如果使用输入，我会得到两个文本，但是我并没有真正寻找任何输入，并且纯文本不允许我查明要修改的文本。 另外，如何插入图标？

Answer 1

多亏了Blazemonger，我才找到了适合我的解决方案。 以下是将文本和图标放置在一行中的绝对位置的代码，使我可以在任何给定时间切换出文本和图标。

moUI.statusMain.setText("<style type=\"text/css\">  </style><div id=\"toolbarObj\"></div><div><span id=\"status_txt\" style=\"max-width: 400px; position:absolute;left:0;top:0\"> Initializing.</span> <img id=\"status_img\" src=\"" + URL_TOOLBAR_IMAGES + "database.png\" alt=\"\" style=\"max-width: 400px; position:absolute;left:100px;top:0\"/></span><span id=\"operation_txt\" style=\"max-width: 400px; position:absolute;left:200px;top:0;\">COPY</span></div>");
document.getElementById("status_txt").textContent = "Done.";
document.getElementById("operation_txt").textContent = "COPY";