JavaScript innerHTML 与 value 属性在 IE 和 Chrome 中的差异分析

innerHTML 属性对空格与回车的处理差异

空格处理

当在DIV元素中输入包含"a"、任意数量的空格以及另一个"a"的字符串时，HTML在Chrome和IE浏览器中的渲染结果一致：最终显示效果仅保留一个空格。

innerHTML属性

• IE浏览器中，innerHTML属性返回两个"a"字符中间包含一个空格。
• Chrome浏览器中，innerHTML属性则保留原始输入的完整格式。

回车处理

当在DIV元素中输入包含"a"、回车符、任意数量的空格以及另一个"a"的字符串时，HTML在Chrome和IE浏览器中的渲染结果一致。

innerHTML属性

• IE浏览器中，innerHTML属性返回3个字符，即在两个"a"之间插入了一个空格。
• Chrome浏览器中，innerHTML属性保留原始输入格式，并将回车符解析为换行符\n。

innerHTML 对 HTML 标记的大小写处理

HTML标记处理

当在DIV元素中输入包含"a"、"<Br>"以及另一个"a"的字符串时，HTML在Chrome和IE浏览器中的渲染结果一致。

innerHTML属性

• 在IE浏览器中，innerHTML属性返回"a<BR>a"，即将HTML标记转换为大写形式。
• 在Chrome浏览器中，innerHTML属性返回"a<br>a"，即将HTML标记转换为小写形式。

value 属性在 TEXTAREA 中的换行符差异

TEXTAREA中回车处理

在textarea多行文本框中输入包含"a"、回车符以及"b"的字符串时，HTML在Chrome和IE浏览器中的渲染结果一致。

value属性

• IE浏览器中，value属性返回4个字符，内容为"a\r\nb"。
• Chrome浏览器中，value属性返回3个字符，内容为"a\nb"。

转载自 http://www.cnblogs.com/zjfree/