javascript - 如何将html内容解析为带格式的文本文件?

标签 javascript html export

我有一个应用程序,用户可以在其中通过 ajax 调用执行一些操作。当 ajax 调用完成后,操作的结果将通过 id = "log" 附加到我的 div 中。我想在他完成工作时创建一个用户选项(按钮 - 导出),以便他可以将其“事件日志”导出到 .txt 文件中。到目前为止,我已经成功做到了这一点,但 html 转换为带有标签等的 txt 文件。我想删除标签并格式化 .txt 文件,但不知道如何。

我的 HTML 代码是

<input type="button" value="Export" onclick="exportLog();">
<div id="log">
    <p>Action 1 successful</p>
    <p>Action 2 unsuccessful </p>
    <p>Action 4 - contact admin</p>
    <p>...etc</p>
</div> 

Javascript代码是

function exportLog(){
    var elHtml = document.getElementById('log').innerHTML;
    var link = document.createElement('a');
    var mimeType = 'text/plain';

    link.setAttribute('download', 'logFile');
    link.setAttribute('href', 'data:' + mimeType  +  ';charset=utf-8,' + encodeURIComponent(elHtml));
    link.click();
}

我在 this 的帮助下做到了这一点。它有效,但我的 .txt 文件就像

<p>Action 1 successful</p><p>Action 2 unsuccessful </p><p>Action 4 - contact admin</p><p>...etc</p>

我希望看起来像

Action 1 successful
Action 2 unsuccessful 
Action 4 - contact admin
...etc

如何实现这一目标?

最佳答案

第一种方法:innerHTML 更改为 innerText

您的工作code

我只改变了这一行

var elHtml = document.getElementById('log').innerText;

第二种方法:

您可以使用textContent API

JsFiddler link

PS:我可以使用这两种方法获取带有换行符的文本

请引用我的文本编辑器的屏幕截图供您引用。

enter image description here

关于javascript - 如何将html内容解析为带格式的文本文件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34785509/

相关文章:

html - Bootstrap 3 Accordion 对 Table 的影响很慢

sql - 使用 PostgreSQL 的 PgAdmin-III 导出数据库

database - 将旧数据从 postgres 导入到 elasticsearch

wordpress - 如何修复 Hugo CMS 中 `found no layout file for "` 的错误 "page"HTML”?

javascript - 使用浮点值制作 math.random

javascript - 获取Json数组中某个元素的最后一个索引

javascript - 这个表单验证有什么问题?

jquery - 使用 Jquery 设置最小宽度

html - CSS 定位和文本

javascript - TypeError : this. props.weather 未定义