Document.write替代實例

Question

我一直在使用document.write生成我的頁面的HTML部分，使用循環來填充它。例如，我需要我的網頁上創建的下列事項10：

<div class=" normal" id="1" 
    style="text-align:left; 
    top: 13px; 
    left: 5px; 
    height: 10em; 
    width: 12em;"> 
    <div class = "wrap"> 
    <div class = "show"> 
     <strong>New York City 
     <p>Status: Cold</p> 
     </strong>   
     </div> 
    <div class = "noshow"> 
     <P>0001: Normal</P>    
     </div> 

    <div class = "here"> 
     <P>0001: online</P> 
     <P>0002: online</P> 

     </div> 
     </div>      
</div> 

我一直在做：

<script> 
document.write("<div class=\""); 
.. you get the idea</script> 

什麼法子與jQuery或只是不-文件撰寫做到這一點？你還可以提供應用於我上面的代碼的簡短示例。

Answer 1

Jquery .html()可能是一件好事用於此目的。

<script> 
    $(function() { 
    var htmlString = "<div>.. you get the idea</div>"; 
    $("body").html(htmlString); 
    }); 
</script> 

或這將追加HTML： .append()

<script> 
    $(function() { 
    var htmlString = "<div>.. you get the idea</div>"; 
    $("body").append($(htmlString)); 
    }); 
</script> 

Answer 2

把整個事情在一個變量：

說：var html_content = "<div class=.....";

，並在你的循環，你可以簡單地使用.append(html_content);

Answer 3

你可以使用DOM操作，直接查詢，並添加節點元素到DOM。

http://www.howtocreate.co.uk/tutorials/javascript/dombasics