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>

javascript - 用动态创建的元素替换字符串

2 个答案: