js 文本自动“换行”理解

定义：当文本的长度大于容器宽度的时候，文本自动换行。

对于中文，以及一般的英文单词，不会出现什么问题。

一般出问题的是长串无分隔的英文单词或字符串，有以下几种情况：

1、一般情况（无浮动 ; 无display：inline-block;）

　　这种情况最好处理，只要加word-wrap: break-word;即可。

2、文本外容器有浮动，或者有display:inline-block;

　　对于非FF浏览器，word-wrap:break-word; word-break:break-all;即可；

　　对于FF浏览器，由于不能识别word-break:break-all;故此法无效，两种办法：

　　法1：看下浮动或者display:inline-block;是否必须，如果非必须，去掉即可；如果必须，那么单纯依靠css教程就达不到这个目的了，求助于JS吧。

　　法2：js实现，但是对于这种方法有一定的局限性，只适用于纯文本的情况。如果想要在文本段中包含其他html标签就会有问题。比如说，如果包含标签，以使得该标签中的文本可以被修饰，如果折断处刚好在标签内部，则该标签就会被破坏，从而变成无意义字符。

参考的js代码如下（参考网上代码）：

3、table布局（FF情况）

　　对于table布局的，此时有个好处，只要在给某一列/行设置了word-wrap:break-word;overflow:hidden;之后，再给该table设置table-layout:fixed;即可达到自动换行效果。