导出为.txt，显示所有<；p>；行并排，而不是一行一行的javascript jquery

我正在尝试将div中的内容导出为.txt文件。但所有段落都是并排呈现的

例如，我在div内容中有如下行：

<div id="content>
    <p>hello</p>
    <p>How are you</p>
</div>

但是我得到的结果是

 hello How are you

以下是指向JSFIDLE的链接： 添加jquery

Html:

 <div id="content">
 <p>hello</p>
 <p>How are you</p>
 </div>
 <a href="#" id="downloadLink">Export as .txt</a><br>

---

拨弄尝试

.textContent

而不是

。innerText

：

• .innerText

  显示文本在HTML中的外观

• .textContent

  将文本显示为原始

  textNodes

请参见下面代码段中的差异：

片段

/*样式用于演示*/
#正文{
边框：1px纯蓝色；
浮动：对；
填充：0 10px；
}
.作为控制台包装{
最小高度：100%；
最大宽度：55%；
}

英
杨,

黑白

善恶

var text=document.getElementById（'text'）；
var iText=text.innerText；
var tContent=text.textContent；
log（'innerText:\n'+iText）；
log（'textContent:\n'+tContent）；

您的小提琴没有任何用处，因为它没有显示问题，但这很可能是CSS问题。如果在DOM检查器中检查

p

元素，则可能已在其上设置了

display:inline

或

float:left

。检查规则设置的位置并将其删除，或者添加一个新的规则来覆盖它。@Rorymcrossan我没有给出任何样式，它的“我的代码”在我的系统中正常工作。这可能有问题fiddle@RoryMcCrossan这是小提琴你试过我的剧本了吗？

 <div id="content">
 <p>hello</p>
 <p>How are you</p>
 </div>
 <a href="#" id="downloadLink">Export as .txt</a><br>

var root = document.getElementById('content');
var arr =[];
var texts = [].map.call( root.querySelectorAll("p"), function(v){
return v.textContent || v.innerText || "";
});

for (var i in texts) {
arr = arr + texts[i];
arr += "\r\n" //new line
}

$("#downloadLink").click(function() {
var hiddenElement = document.createElement('a');
hiddenElement.href = 'data:attachment/text,' + encodeURI(arr);
hiddenElement.target = '_blank';
hiddenElement.download = 'myFile.txt';
hiddenElement.click('downloadLink');
});