javascriptから追加された複数の要素をHTMLに分割するにはどうすればよいですか？

Question

私はHTML/JavaScriptで以下の画像を再生しようとしています：

これは私が持っているどのくらいです：

これはJavaScriptで私のコードです：

function createLink(text, parentElement) { 
    var a = document.createElement('a'); 
    var linkText = document.createTextNode(text); 
    a.appendChild(linkText); 
    temp1 = text.replace("/","-"); 
    temp2 = res1.replace("/","-"); 
    a.href = "http://www.drakedesign.co.uk/mdmarketing/uploads/" + temp2 + ".csv"; 
    parentElement.appendChild(a); 
} 

var txtFile8 = new XMLHttpRequest(); 
txtFile8.open("GET", "http://www.drakedesign.co.uk/mdmarketing/uploads/date.txt", true); 
txtFile8.onreadystatechange = function() { 
    if (txtFile8.readyState === 4) { // Makes sure the document is ready to parse. 
     if((txtFile8.status == 200) || (txtFile8.status == 0)) { // Makes sure it's found the file. 
      allText8 = txtFile8.responseText; 
      arrayOfLines8 = allText8.match(/[^\r\n]+/g); 
      for (i = 0; i < arrayOfLines8.length - 1; i++) { 
       createLink(arrayOfLines8[i], document.getElementById("previousResultsList")); 
      }   
     } 
    } 
}; 

txtFile8.send(null); 

このコードスニペットでは、次の処理を行います。 は、日付を含むオンラインテキストファイルを読み込みます。 は、各日付を配列内の要素に分割します。最初の問題は、「previousResultsList」

：：私は書いてい

は、私はおそらくのdivに追加要素を区切ることができるか尋ねるのdiv previousResultsList内のリンクに各日付を行うforループを通じ 実行

1）リスト形式で単純に要素を区切ります。

2）その月の任意の日付について、日付をチャンクに分割し、側面に画像を添付するにはどうすればよいですか。

Answer 1

私はそれがスクリーンショットに基づいてCSSとposition: abosluteと関係があると推測しています。あなたがHTMLとCSSを投稿しない限り、はるかにできません。

私はここで働い例を持ってhttps://jsfiddle.net/tkcohpqv/20/

あなたの関数でこれを追加し、それは限りparentElement幅が同じライン上の2つの要素の幅より小さいようaをスタックして分離します。

var a = document.createElement('a'); 
$(a).css('position', ''); 
$(a).css('display', 'block'); 
$(a).css('float', 'left'); 

Answer 2

私は相対的にCSSの位置を編集することによってこの問題を解決し、追加することによって、自分のコードを編集した：

 var br = document.createElement('br'); 
     parentElement.appendChild(br); 

を私CREATELINK（）関数の最後に。