关于换行符,网上有许多说法,IE早期的浏览器是\r\n,有的浏览器是\r,但很难找到确切的版本号。经过本人正则匹配测试,chrome、firefox、safari、IE11都是\n,

因此保险起见,若对换行符进行正则匹配,应当同时匹配\n, \r以及\r\n.

值得一提的是\n、\r和\r\n都有换一行的效果,有些同学写换行时常写作\n\r,这就相当于换了两行,因此必须注意!

换行符用于textarea

textarea内的换行便是以换行符的形式实现,换行符也能用于textarea

换行符用于一般div

当我们尝试将\n用于一般div

eg: document.querySelector(".a").innerHTML= "12\n1";

显示:

未显示换行,这是因为在默认情况下空白会被忽略,所以无论是文本里的空白、换行都会被当做一个空格处理,

若想显示空白,需添加属性white-space: pre; 保留换行和空白 或者pre-line 保留换行,忽略空白

增添white-space: pre;显示:

这时候获取innerHTML,输出: 12 1,

/\n/.test(document.querySelector(".a").innerHTML) // true,

换行符用于可编辑div

eg: document.querySelector(".a").innerHTML= "1        2\n1";

显示:

通过审查元素,可以发现可编辑div自带white-space: pre;属性!因此文本空白和换行符都对它有效

而可编辑div内直接进行换行操作,换行又是如何实现的?

进行换行:

再输出innerHTML

1 2 1 <div>11</div><div>111</div>

因此: 对于可编辑div,换行符有效,但它本身的换行是通过div来实现的,这不同于textarea!

一般pre

对于一般pre,文本空格与换行符都有效,也自带white-space: pre;属性。

可编辑pre

类似于可编辑div,换行符有效,本身的换行通过增添div实现。

换行符在textarea、div、pre中的区别的更多相关文章

  1. 回车符(CR)与换行符(LF), '\r'和'\n'的区别

    回车”(Carriage Return)和“换行”(Line Feed)这两个概念的来历和区别.在计算机还没有出现之前,有一种叫做电传打字机(Teletype Model 33,Linux/Unix下 ...

  2. sybase数据库和oracle数据库中字段中含有换行符的解决办法

    最近在做数据库从sybase到oracle的迁移工作,sybase数据库表bcp导出后,通过sqlldr导入到oracle数据库,然后oracle数据库通过spool按照sybase数据库bcp的格式 ...

  3. 在Javascript弹出窗口中输入换行符

    private void showMessage(string strMsg) { Page.RegisterStartupScript("scriptStr", "&l ...

  4. nl2br()处理字符串中的换行符

    nl2br() 函数 在字符串中包含换行符时,需要对其进行转换,php 中有str_replace()函数,可以直接对字符串进行替换处理.但php中还有nl2br()函数可以直接处理. 1.在字符串中 ...

  5. js-textarea文本换行符处理,Java后端以及js前端如何处理

    方法一:后台处理 TextArea的换行符处理 TextArea文本转换为Html:写入数据库时使用 js获取了textArea的文本内容之后,器内容含有换行,空格,制表符之类的字符,但是js字符串不 ...

  6. js-TextArea的换行符处理

    js-txt文本处理 写自己主页项目时所产生的小问题拿出来给大家分享分享,以此共勉. ---DanlV TextArea的换行符处理 TextArea文本转换为Html:写入数据库时使用 js获取了t ...

  7. C# 换行符

    winform 中 TextBox 的 Multiline属性设置为 true ,敲入几个字符和几个回车,然后保存到数据库,再从数据库中读取出来赋值给TextBox,换行符丢失.将读取出的字符串中的& ...

  8. git 换行符问题

    git 换行符问题 在windows环境中 对于autocrlf = false 不会激发 关于换行符的处理 对于autocrlf = true 会在提交是将LF替换成CRLF 切出时时CRLF 对于 ...

  9. ABAP 字符串换行符处理

    今天发现BW系统从K3系统数据库抽取会计科目的描述时,转换出错. 从监控器上看是值2KO 845 412D#有问题,但不知道有什么问题,检查后感觉是符号#的问题. 在转换中添加代码,替换#,发现没有起 ...

随机推荐

  1. hive0.13.1安装-mysql server作为hive的metastore

    hive0.13.1在hadoop2.4.1伪分布式部署上安装过程 环境:redhat enterprice 6.5 +hadoop2.4.1+hive0.13.1+mysql单节点伪分布式部署 相关 ...

  2. 编写gulpfile.js文件:压缩合并css、js

    使用gulp一共有四个步骤: 1. 全局安装 gulp: $ npm install --global gulp 2. 作为项目的开发依赖(devDependencies)安装: $ npm inst ...

  3. go语言递归创建目录

    import ( "fmt" "os" ) func main() { //创建C:/temp/log文件夹 // err := os.MkdirAll(&qu ...

  4. Lucene建立索引搜索入门实例

                                第一部分:Lucene建立索引 Lucene建立索引主要有以下两步:第一步:建立索引器第二步:添加索引文件准备在f盘建立lucene文件夹,然后 ...

  5. ADO.NET详细学习笔记《一》

    目录 ADO.NET和ADO的区别 ADO.NET的五大核心对象 Connection对象 Command对象 DataAdapter对象,DataSet对象 DataReader对象 [1]ADO. ...

  6. MVC action 执行两次 background url()

    大年初七第一天上班就来解决问题,我也是醉了. 其实是历史遗留问题,今天看到后不能忍了,赶紧解决一下. 旧系统中以一个微信版本的列表页面没有问题,在新系统中重新开发一边后发现列表页面的action总是请 ...

  7. SharePoint服务器端对象模型 之 访问网站和列表数据(Part 2)

    (二)列表(SPList) 列表是SharePoint中最为重要的数据容器,我们一般保存在SharePoint中的所有数据,都是保存在列表中(文档库也是一种列表),因此列表对象在SharePoint的 ...

  8. 自定义表单验证--jquery validator addMethod的使用

    原文地址:jquery validator addMethod 方法的使用作者:蜡笔小玄 jQuery.validate是一款非常不错的表单验证工具,简单易上手,而且能达到很好的体验效果,虽然说在项目 ...

  9. C++常备知识总结

    1.extern表示是外部函数或外部变量,比如: 1.extern void add(int x,inty);表示该函数主体不在当前模块中,在另一个模块中(文件)2.extern int total; ...

  10. NSCache类的简单介绍

    最近看SDWebImage,里面的内存缓存用到了NSCache这个类,由于以前没有使用过,特此记录学习一下. NSCache NSCache是苹果官方提供的缓存类,用法和NSMutableDicton ...