js字符串中空格和换行符(\r,\s,\n,\r\n)浅析

 更新时间:2022年07月27日 09:42:45   作者:_Dream maker  
我们在使用字符串时经常会遇到换行问题,下面这篇文章主要给大家介绍了关于js字符串中空格和换行符(\r,\s,\n,\r\n)的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下

一、换行,回车

换行回车在不同操作系统下的含义

以下均为单击 Enter 键产生

  • Windows:系统行末结束符是 ‘\r\n
  • Linux:统行末结束符是 ‘\n
  • Mac:系统行末结束符是 ‘\r

关于软 / 硬回车的扩展知识

硬回车:就是普通我们按回车产生的,它在换行的同时也起着段落分隔的作用。
软回车:是用 Shift + Enter 产生的,它换行,但是并不换段,即前后两段文字在 Word 中属于同一“段”。在应用格式时你会体会到这一点。

软回车能使前后两行的行间距大幅度缩小,因为它不是段落标记,要和法定的段落标记——硬回车区别出来。硬回车的html代码是<p>…</p>,段落的内容就夹在里面,而软回车的代码很精悍:<br/>。 网页的文字如果复制到word中,则硬回车变为弯曲的箭头(),软回车变为向下的箭头()。

js 字符串中的字符替换

将字符串中的换行符替换成在HTML中正确显示换行的的 <br/> 换行标签。

const text = 'Hello World\r\n2021'
text.replace(/(\n|\r|\r\n|↵)/g, '<br/>')

二、空白符

js 字符串中的字符替换

将字符串中的空格符替换成HTML中正确显示连续空格的&nbsp;转义字符。

const text = 'Hello\s\s\sWorld\s2021'
text.replace(/\s/g, '&nbsp;');

补充:js字符串指定位置换行

function huanhang(_str){    
  var str = _str, result = "";
                    var n=10;//指定第n位换行
  for(var i=0,len=str.length;i<len;i++){
  
      result += str[i];
      if((i+1) % n== 0)
      result += "\r\n";
  }
  return result;
}

总结

到此这篇关于js字符串中空格和换行符(\r,\s,\n,\r\n)的文章就介绍到这了,更多相关js字符串空格和换行符内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • 详细分析jsonp的原理和实现方式

    详细分析jsonp的原理和实现方式

    给大家图文详细分析一下jsonp的原理以及跨域问题的汇总。
    2017-11-11
  • JavaScript reduce方法使用方法介绍

    JavaScript reduce方法使用方法介绍

    Reduce是个纯函数,即只要传入相同的参数,每次都应返回相同的结果。不要把和处理数据无关的代码放在Reduce里,让Reduce保持纯净,只是单纯地执行计算,这篇文章主要介绍了Redux拆分reduce函数流程
    2022-10-10
  • JavaScript常用标签和方法总结

    JavaScript常用标签和方法总结

    JavaScript可以被浏览器直接解释执行,它可以更好得减小服务器压力,提高程序运行效率,下面小编通过本篇文章给大家分享JavaScript常用标签和方法,需要的朋友一起来学习吧
    2015-09-09
  • JavaScript判断是否为数字的多种方法小结

    JavaScript判断是否为数字的多种方法小结

    这篇文章主要介绍了JavaScript判断是否为数字的多种方法小结,本文给大家分享三种方法,结合实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧
    2024-01-01
  • javascript经典特效分享 手风琴、轮播图、图片滑动

    javascript经典特效分享 手风琴、轮播图、图片滑动

    这篇文章主要介绍了javascript经典特效,手风琴、轮播图、图片滑动效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-09-09
  • javascript设计模式 – 模板方法模式原理与用法实例分析

    javascript设计模式 – 模板方法模式原理与用法实例分析

    这篇文章主要介绍了javascript设计模式 – 模板方法模式原理,结合实例形式分析了javascript模板方法模式相关概念、原理、用法及操作注意事项,需要的朋友可以参考下
    2020-04-04
  • js实现新浪微博首页效果

    js实现新浪微博首页效果

    现在微博都有一个不错的效果就是会实时的动态滚动并显示最新的信息了,下面我来给大家介绍仿新浪微博大厅首页滚动效果,希望此方法对大家会有帮助。
    2015-10-10
  • javascript中字符串拼接详解

    javascript中字符串拼接详解

    字符串拼接是所有程序设计语言都需要的操作。当拼接结果较长时,如何保证效率就成为一个很重要的问题。本文介绍的是Javascript中的字符串拼接,希望对你有帮助,一起来看。
    2014-09-09
  • Uni-app跨平台开发应用入门实战

    Uni-app跨平台开发应用入门实战

    这篇文章主要为大家介绍了Uni-app跨平台开发应用入门实战示例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-03-03
  • 浅谈JavaScript的几种继承实现方式

    浅谈JavaScript的几种继承实现方式

    本文主要介绍了浅谈JavaScript的几种继承实现方式,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2023-04-04

最新评论