把想要的結構寫在HTML裏，用一個display：none的標簽來包裹。

一般而言，會使用：

• 不設置為type="text/javascript"的script標簽
• textarea標簽

<script type="text/html" id="theTemplate">
    編寫你的html結構
</script>

或

<textarea id="theTemplate" style="display:none">
編寫你的html結構
</textarea>

使用這些標簽，是為了避免這些不被直接使用的標簽一被瀏覽器讀取到就被渲染。而且這樣做的話，裏面的img的src也不會被瀏覽器自動獲取。
 

如果你使用script標簽，就可以如下代碼得到它：

//使用script包裹
var template = document.getElementById("theTemplate").innerHTML ;
//使用textarea包裹
var template = document.getElementById("theTemplate").value ;

使用時textarea時要註意，textarea無法嵌套自身；script標簽也無法自嵌套。

如何優雅的用js動態的添加html代碼?