接口返回文本 html保持原有格式输出文本且自动换行

使用HTML的pre标签:<pre> 元素可定义预格式化的文本。被包围在 pre 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。

<pre class="content">
   提示条款
   您的信任对我们非常重要,一直以来,平台都致力于为每位用户提供更安全的互联网环境。我们深知个人信息安全的重要性,我们将按照法律法规要求,采取安全保护措施,保护您的个人信息安全可控。鉴此,平台(或简称“我们”)制定本《法律声明与隐私政策》(以下或简称“声明和政策”)并提醒您:
   本政策适用于平台的产品或服务。如关联公司(范围详见定义部分)的产品或服务中使用了平台提供的产品或服务(例如直接使用平台账户登录)但未设独立法律声明与隐私政策的,则本政策同样适用于该部分产品或服务。
   请您注意,本政策和声明不适用于以下情况:
   1)通过我们的服务而接入的第三方服务(包括任何第三方网站)收集的信息;
   2)通过在我们服务中进行广告服务的其他公司或机构所收集的信息。
   在使用的各项服务前,请您务必仔细阅读并透彻理解本《法律声明与隐私政策》,在确认充分理解并同意后方使用相关产品和服务。一旦您开始使用平台服务,将被视为对本声明和政策内容的接受和认可。
   法律声明
 </pre>  

但<pre>的内容不会自动换行【注:在使用过程中,如果是在移动端会发现文字会超出屏幕,形成横向滚动条】 ==》让<pre>文本内容自动换行 (兼容多个浏览器):

.content{
  white-space: pre-wrap;
  white-space: -moz-pre-wrap;
  white-space: -pre-wrap;
  white-space: -o-pre-wrap;
  *word-wrap: break-word;
  *white-space : normal ;  
}

接口返回文本 html保持原有格式输出文本且自动换行

正则匹配接口返回的空格展示

 res=res.replace(/\s/gm,'&nbsp');

正则匹配接口返回换行字符“↵”

var myString = myString.replace(/(\r\n|\n|\r)/gm, "<br />");

如何处理html中的换行字符“↵”

上一篇:CSS实现水平垂直居中的8种方式


下一篇:flex-wrap后 有大量空白 或者很大的间隙