加入元素的div

Question

好了，這裏是我的代碼： HTML：

<h2>Header</h2> 
    <div id="results1" class="results"> 
     <h1>Results 1</h1> 
    </div> 

JS：

(function() { 
    var results = document.getElementById('results1'); 
    var drink = [ 'Rum', 'Vodka', 'Whiskey', 'Beer' ]; 
})(); 

我需要飲料添加到結果元素的div。

Answer 1

只是一個簡單的for循環遍歷array，然後將每個項目追加到結果div。

for (var i = 0 ; i < fruit.length; i++) { 
    results.innerHTML += "<div>" + fruit[i] + "</div>"; 
}; 

JSFiddle Demo

Answer 2

使用純JavaScript：

(function() { 

    var results = document.getElementById('results1'); 
    var fruits = [ 'Rum', 'Vodka', 'Whiskey', 'Beer' ]; 

    for(var i = 0; i < fruits.length; i++){ 

    var fruit = document.createElement('div').innerHTML = fruits[i]; 

    results.appendChild(fruit); 

    } 
})(); 

Answer 3

Demo 嘗試這樣

var parent = $("#results1"); 
var fruit = ['Rum', 'Vodka', 'Whiskey', 'Beer']; 

$.each(fruit, function (i, val) { 

    parent.append("<div id=" + val + " >" + val + "</div>"); 

}); 

Answer 4

您可以使用此：

JS

(function() { 
    var results = document.getElementById('results1'); 
    var fruit = [ 'Rum', 'Vodka', 'Whiskey', 'Beer' ]; 


    for(var i=0; i<fruit.length; i++){ 
     var div = $("<div>" + fruit[i] + "</div>"); 
     $(div).appendTo("#results1"); 
    } 

})(); 

fiddle

Answer 5

(function() { 
    var results = document.getElementById('results1'); 
    var fruit = [ 'Rum', 'Vodka', 'Whiskey', 'Beer' ]; 
    for(var i=0; i<fruit.length;i++){ 
     $("#results1").append('<div>'+fruit[i]+'</div>'); 
    } 
})(); 

Answer 6

fruit.forEach(function(value,index){ 
    var div = document.createElement('div'); 
    div.innerHTML = value; 
    $("#results1").append(div); 
}); 

Answer 7

你可以試試這個：

(function() { 
    var results = document.getElementById('results1'); 
    var drink = [ 'Rum', 'Vodka', 'Whiskey', 'Beer' ]; 
    results.innerHTML += '<div>' + drink.join('</div><div>') + '</div>'; 
})(); 

Answer 8

這是for循環，你可以使用JavaScript的 並納入你的HTML 。

var drink = ["Rum", "Vodka", "Whiskey", "Beer"]; 
for (index = 0; index < drink.length; ++index) { 
    text += drink[index]; 
}