2017-10-27 13 views
2

divコンテンツをテキスト形式でダウンロードしようとしています。jsを使用してダウンロードしたテキストファイルに改行を追加するには

divコンテンツの中身をtxt形式でダウンロードできますが、内容はすべて同じ行です。

各要素に改行を追加する必要があります。

function download() { 
 
     var a = document.body.appendChild(
 
      document.createElement("a") 
 
     ); 
 
     a.download = "export.txt"; 
 
     a.href = "data:text/html," + document.getElementById("show-data").innerHTML; 
 
     a.click(); 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="show-data"> 
 
<p>one</p> 
 
<p>two</p> 
 
<p>Three</p> 
 
</div> 
 
<button onClick="download()">Download</button>

https://jsfiddle.net/1L2vmdhu/

+0

はそれを取得できませんでしたし、その有するラインは –

+0

@VenkateshKonathamは質問を更新し – CodeMan

+0

下記の私の答えをチェックしてください破ります –

答えて

5

あなたは、URLの形式でデータを渡しているとして、あなたはそれを動作させるだろう改行文字をエンコードする必要があり、例えば、以下にしようとすると、他の事はあなたがそうコンテンツタイプを変更するには、テキストとしてダウンロードしようとしているでください。 "text/plainの"

function download() { 
 
     var a = document.body.appendChild(
 
      document.createElement("a") 
 
     ); 
 
     var textToWrite = document.getElementById("show-data").innerText; 
 
     a.download = "export.txt"; 
 
     textToWrite = textToWrite.replace(/\n/g, "%0D%0A"); 
 
     a.href = "data:text/plain," + textToWrite; 
 
     a.click(); 
 
    }
<div id="show-data"> 
 
<p>one</p> 
 
<p>two</p> 
 
<p>Three</p> 
 
</div> 
 
    <button onClick="download()">Download</button>

-2

EDIT。

すべての行の末尾に\ r \ nを追加し、テキスト出力にエンコードするためにencodeURIComponentをテキストファイルに出力する前に使用できます。 私はここにそれを追加しました。

https://jsfiddle.net/1L2vmdhu/11/

私はそれを動作させるために、このようなJavaScriptを変更しました。

function download() { 
    var a = document.body.appendChild(
     document.createElement("a") 
    ); 
    a.download = "export.txt"; 

    var list = document.getElementsByTagName("p"); 
    var b = ""; 
    for (var i = 0; i < list.length; i++) { 
     console.log(list[i].innerHTML); 
     b += list[i].innerHTML + "\r\n"; 
    } 
    b = encodeURIComponent(b); 
    a.href = "data:text/html," + b; 
    a.click(); 
} 
関連する問題