一、textarea进行文本换行
this.descText = val.replace(/\n/g, '<br>') || val.replace(/\r\n/g, '<br>') || val.replace(/\r/g, '<br>') ;
二、换行符在textarea、div、pre中的区别
关于换行符,网上有许多说法,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";
再输出innerHTML
1 2 1 <div>11</div><div>111</div>