javascript - 将文本标签和/或图标附加到 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";