javascript - 用動態創建的元素替換字符串

Question

我想用動態創建的元素替換佔位符。

方法

var myhtml = 'some html and stuff {IMAGE} some more html'; 
myhtml = myhtml.replace(/{IMAGE}/g, document.createElement('img')); 
console.log(myhtml); // some html and stuff [object HTMLImageElement] some more html 

我怎樣才能使它所以它與實際的HTML輸出代替它？

提前致謝！

Answer 1

您應該將動態創建的第一個元素追加到一個空的容器（可能是動態創建DIV），然後讓該容器的innerHTML。

例子：

var myhtml = 'some html and stuff {IMAGE} some more html'; 
var elem = document.createElement("img"); 
var elemContainer = document.createElement("div"); 
elemContainer.appendChild(elem); 
var elemHtml = elemContainer.innerHTML; 
myhtml = myhtml.replace(/{IMAGE}/g, elemHtml); 
console.log(myhtml); 

Answer 2

您可以使用一個醜陋的代碼是這樣的：

<script type="text/javascript> 
    var tmp = document.createElement("img"); 
    var tmp2 = document.createElement("div"); 
    tmp2.appendChild(tmp); 
    alert(tmp2.innerHTML); 
</script>