时间：2021-07-01 10:21:17 帮助过：30人阅读
昨天在盯着代码发呆的时候有人告诉我，我写的一个页面样式乱掉了。项目还没有上线，必须马上解决掉。看到页面的时候有些奇怪，我所有的数据都是从后台拿到后通过模板插入的，不可能其他的是好的，只有一条是乱的！于是马上审查元素，发现样式乱掉的那一部分dom结构被改变了，找到对应的填充到那里的数据，原来数据里面含有特殊字符，被html解析成了标签因此改变了我的dom结构。很快的发现了问题，下面就是解决它啦！
由于之前没有碰到过这种情况，经验不足，所以我的第一反应是在模板里面用innerText，果然报错了；转换成字符串？可人家本来就是字符串啊（哈哈，原谅我的无知）！
后来想想好像可以用input来解决这个问题。下面就来说说我用这两个标签所带来的问题......
从后台获取的数据："/::~/::B/::|/:8-)/:: 1.input
将原本包裹这条数据的div标签改成了input标签，并通过css改变了其样式
目测是没有问题的，数据正常显示，dom没有错乱。可是好奇宝宝并没有止于此，在控制台里面将value改的老长，此时问题来了，input是单行文本框，是不会自动换行的（原来我早已将这件事抛之脑后了）
尝试着搜了一下input换行的问题，没有搜到怎么换行，只是说可以用textarea实现多行。（哪位大神指导请告诉我，小女子不胜感激~）
2.textarea于是果断将input换成了textarea，并通过css改变了其样式
将标签中的内容输的很长，问题很快就出现了：1.文本内容过长的时候会产生滚动条；2.高度不会自适应
这些都是我知道的事，之前没有需求所以没有觉得有什么不妥，看来这次是要解决一下啦~
在我有限的认知范围内当然是先这样：overflow:auto然而并没有什么效果
然后当然是搜搜搜......
关于这个问题，我找到一些答案，点击这里......
也找到比较好的解决方法，点击这里......
仔细看一看这些问题还是蛮有趣的，不同的视角同一个方向，感觉自己又见识了好多，将这两个链接放在这里，也许每次看的时候都会有新的收获！