將文本標簽和/或圖標附加到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";