一、textarea進(jìn)行文本換行
this.descText = val.replace(/\n/g, '<br>') || val.replace(/\r\n/g, '<br>') || val.replace(/\r/g, '<br>') ;
二附井、換行符在textarea讨越、div、pre中的區(qū)別
- 關(guān)于換行符永毅，網(wǎng)上有許多說法把跨，IE早期的瀏覽器是\r\n,有的瀏覽器是\r,但很難找到確切的版本號。經(jīng)過本人正則匹配測試沼死，chrome着逐、firefox、safari漫雕、IE11都是\n,
- 因此保險起見,若對換行符進(jìn)行正則匹配，應(yīng)當(dāng)同時匹配\n, \r以及\r\n.
- 值得一提的是\n峰鄙、\r和\r\n都有換一行的效果浸间，有些同學(xué)寫換行時常寫作\n\r,這就相當(dāng)于換了兩行，因此必須注意吟榴！
三魁蒜、換行符用于textarea
textarea內(nèi)的換行便是以換行符的形式實現(xiàn)，換行符也能用于textarea
四、換行符用于一般div
當(dāng)我們嘗試將\n用于一般div
eg: document.querySelector(".a").innerHTML= "12\n1";
顯示:
未顯示換行兜看，這是因為在默認(rèn)情況下空白會被忽略锥咸，所以無論是文本里的空白、換行都會被當(dāng)做一個空格處理细移，
若想顯示空白搏予，需添加屬性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";
顯示:
通過審查元素精绎，可以發(fā)現(xiàn)可編輯div自帶white-space: pre;屬性速缨！因此文本空白和換行符都對它有效
而可編輯div內(nèi)直接進(jìn)行換行操作，換行又是如何實現(xiàn)的代乃？
進(jìn)行換行:
再輸出innerHTML
1 2 1 <div>11</div><div>111</div>
因此: 對于可編輯div旬牲，換行符有效，但它本身的換行是通過div來實現(xiàn)的搁吓，這不同于textarea!
一般pre
對于一般pre原茅，文本空格與換行符都有效，也自帶white-space: pre;屬性擎浴。
可編輯pre
類似于可編輯div员咽，換行符有效，本身的換行通過增添div實現(xiàn)贮预。
