javascriptのみを使用してdivを動的に追加する

Question

ここは私のコードの一部です。

JavaScriptを使用してdiv要素を動的に作成したいと思います。私はここからの異なったウェブサイトおよび質問からのコードを使用して初めてそれをしています。

しかし、このループは何もしていないようです。

すべてのクラスがCSSに存在します。エラーを見つけて、他の提案が大歓迎です。

var i; 
 

 
for (i = 0; i < 20; i++) { 
 
    var main = document.getElementById('show'); 
 

 
    var div1 = document.createElement('div'); 
 
    div1.id = 's' + i; 
 
    div1.className = 'perschoolcontainer'; 
 
    var link2 = document.createElement('a'); 
 
    link2.setAttribute('href', 'abcd.jpg'); 
 

 
    var image3 = document.createElement('img'); 
 
    image3.id = 'dp'; 
 
    image3.src = 'davsv.jpg'; 
 
    image3.class = 'dp'; 
 

 
    var p4 = document.createElement('p'); 
 
    p4.id = 'sname'; 
 
    p4.class = 'sname'; 
 

 
    var p5 = document.createElement('p'); 
 
    p5.id = 'location'; 
 
    p5.class = 'location'; 
 

 
    var t1 = document.createTextNode('abc'); 
 
    var t2 = document.createTextNode('def'); 
 

 
    p5.appendChild(t2); 
 
    p4.appendChild(t1); 
 
    link2.appendChild(image3); 
 
    link2.appendChild(p4); 
 
    link2.appendChild(p5); 
 
    div1.appendChild(link2); 
 

 
    main.innerHTML.appendChild(div1); 
 
}

<div id="s1" class="perschoolcontainer"> 
 
    <a href="davsv.jpg"> 
 
    <img id="dp" class="dp" src="davsv.jpg" alt="DAV"> 
 
    <div id="details" class="details"> 
 
     <p id="sname" class="sname">DAV</p> 
 
     <p id="location" class="location">Sv</p> 
 
    </div> 
 
    </a> 
 
</div>

Answer 1

innerHTMLappendChild方法を持っていません。変更：あなたは私たちがriiiiiiiiiiiiightまでスクロールしたい

main.appendChild(div1);