2011-03-31 71 views
1

我需要在我的代碼重複這一內容的十倍,那麼我認爲這是可能像一個for或while循環,但我想,我不能循環的JavaScript

<li> 
    <img style="float: left;" src="img/gaja.jpg" alt="Angry face" /> 
    <div style="width: 100px; height: 20px; float:left; margin-left: 5px; font: bold 12px arial;">IceMan</div> 
    <div style="width: 150px; height: 20px; float:left; margin-left:5px;">Web Designer/FullTime</div> 
</li> 

任何幫助?

感謝

回答

5
var li = $('li'); 
for(var i = 0; i < 10; i++) { 
    li.clone().appendTo(li.parent()); 
} 
+0

爲什麼你需要jquery的東西如此微不足道? – Neal 2011-03-31 15:18:44

+0

我認爲它的jsut是因爲jQuery用於現在的一切。簡單與否,jQuery使它變得簡單:) – Damb 2011-03-31 15:22:48

+0

...因爲替代方案是代碼行數的兩倍。 – 2011-03-31 15:23:19

0
for (var i = 0; i < 10; i++) 
{ 
    document.write('<li>'); 
    document.write('<img style="float: left;" src="img/gaja.jpg" alt="Angry face" />'); 
    document.write('<div style="width: 100px; height: 20px; float:left; margin-left: 5px; font: bold 12px arial;">IceMan</div>'); 
    document.write('<div style="width: 150px; height: 20px; float:left; margin-left:5px;">Web Designer/FullTime</div>'); 
    document.write('</li>'); 
} 
+0

如果您不太依賴JavaScript,那麼您可以使用真正基本的純JavaScript方法。 – Damb 2011-03-31 15:21:51

+0

您的代碼導致無格式內容:/ – user455318 2011-03-31 15:24:48

+0

已經發布了更好的方式來執行此操作。我只是最基本的:) – Damb 2011-03-31 15:32:14

2

由於在inital的問題,我要承擔不使用它沒有指定的jQuery。

的純JavaScript的方式是像這樣:

var ul = document.getElementsByTagName("ul")[0]; 
var li = ul.getElementsByTagName("li")[0]; 
for(var i=1;i<10;i++){ 
    ul.appendChild(li.cloneNode(true)); 
} 

代碼示例上jsfiddle