2011-08-16 14 views
0

実行時にhtml要素を生成する方法はありますか?実行時に任意の量のHTML要素を動的に生成する方法はありますか?

たとえば、ユーザーが任意の数値を入力するためのテキストフィールドがあります。
要件: 1.ユーザーが10を入力すると、10個のIMG要素タグが生成されます。 2.我々はまた、各10の出力は、などのIMG SRC =「選択されたパス」のようなものでなければなりません 3. SRC IMGの値を操作することができ、<は--Dynamically

任意のアイデア/提案を生成しますか? jQueryを使って

答えて

1

例:

HTML:

<input type="text" id="my-input" value="0" /> 
<div id="container"></div> 

JS:これは簡単ではJavaScriptフレームワークと

$('#my-input').change(function() { 
    var el = $(this); 
    for (var i=0; i < parseInt(el.val(), 10); i++) { 
    $('#container').append('<img src="blabla" />'); 
    } 
}); 
0

。例えば

jqueryの:

for(var a=0;a<number;a++){ 
    var newelement = $('<img............../>'); 
    $('#parentElement').append(newelement); 
} 
0

を使用できdocument.createElement()すなわち

for(var x = 0; x < 10; x++){ 
    var img = document.createElement("img"); 
    // set the properties 
    ... 
} 
1

HTML

<input type="text" id="myInput" /> 
<input type="text" id="myPath" /> 

Javascriptを

var count=document.getElementById('myInput').value; 
var path=document.getElementById('myPath').value; 
for(i=0; i<count; i++) 
{ 
    var img=document.createElement('img'); 
    img.setAttribute('src', path); 

    parent.appendChild(img); //now append the element to the desired div 
} 
関連する問題