jQuery text（）调用在Firefox中保留换行符，但不在IE中 [英] jQuery text() call preserves newlines in Firefox but not in IE

问题描述

我在做：

  alert（$（＃div）。 
  

：

 < div id =div> 
& lt; div& gt; 
一些文本
& lt; div& gt; 
< / div> 
  

为什么要转义内容？因为它有时格式错误，我不想干扰或破坏文档的其余部分。

在FF中，它显示保留换行符。在IE7它不。我需要保留空白。

在任何人推荐富文本编辑器之前，此代码并不是真正的HTML。

解决方案

div>

看起来这是我的问题： Internet Explorer innerHTML Quirk ：

但是，innerHTML在
Internet Explorer中有一个问题。

HTML标准需要在显示内容时进行
转换。
各种类型和数量的相邻
空格被折叠成单个
空格。这是一件好事 - 就像
一样，它允许我在这个源文件
中添加了很多
的换行符而不必担心在显示的文本中有奇怪的
换行符。

Internet Explorer将这些
转换应用于
innerHTML属性。这似乎是一个
好​​主意：它在显示期间节省了一点时间
，因为如果
内存中的表示已经
正规化，则浏览器不
必须标准化，每当需要
显示文本。

但是，
规范化规则有例外。值得注意的是，
这些是< textarea>元素，
< pre>元素，并且在CSS-认识的
浏览器中，具有任何值但是
正常的元素-space属性。

这些特殊情况下，Internet Explorer不尊重
。第三个使
的优化是一个坏主意，因为
白空间可能在运行时改变，
例如通过DOM。在任何
的情况下，Internet Explorer将正则化
所有赋值给innerHTML
属性，从而产生如下所示的效果
。

此文本填充文本区域在
页。这也包含换行符
和多个空格。格式化是
保存在这里，除了
UA可能会破线。

确实，如果我将其更改为：

 < div id =div> 
< pre> 
 ... 
< / pre> 
< / div> 
  

和

  $（＃div pre）。text（）
  

p>

 < style type =text / css> 
 #div {white-space：pre} 
< / style> 
  

所有神奇的作品。

I'm doing:

alert($("#div").text());

on something like this:

<div id="div">
&lt;div&gt;
Some text
&lt;div&gt;
</div>

Why the escaped content? Because it is sometimes malformed and I don't want it interfering with or breaking the rest of the document.

In FF it shows up preserving newlines. In IE7 it doesn't. I need to preserve the white space. This content is actually going in a textarea for editing.

And before anyone recommends a rich text editor, this code isn't really HTML. It's a custom dialect.

So how do I keep the newlines in IE?

解决方案

It looks like this is my problem: The Internet Explorer innerHTML Quirk:

However, innerHTML has a problem in Internet Explorer.

The HTML standard requires a transformation on display of content. All kinds and amounts of adjacent whitespace are collapsed into a single space. This is a good thing - just as an example, it allows me to add a lot of line breaks into this source file without having to worry about weird line breaks in the displayed text.

Internet Explorer applies these transformations on assignment to the innerHTML property. This seems like a good idea: it saves a little time during display, because if the in-memory representation is already normalized, then the browser doesn't have to normalize whenever it needs to display the text.

There are exceptions to the normalization rule, though. Notably, these are the <textarea> element, the <pre> element and, in CSS-aware browsers, elements with any value but normal for the white-space property.

Internet Explorer does not respect these special cases. The third makes their optimization a bad idea, because white-space might change at runtime, for example through the DOM. In any case, Internet Explorer will normalize all assignments to the innerHTML property, thus causing the effect demonstrated below.

This text fills the textarea at page load. This, too, contains line breaks and multiple spaces. Formatting is preserved here as well, except that the UA may break lines.

(emphasis added)

And indeed if I change it to:

<div id="div">
<pre>
...
</pre>
</div>

and

$("#div pre").text()

or simply:

<style type="text/css">
#div { white-space: pre }
</style>

it all magically works.

这篇关于jQuery text（）调用在Firefox中保留换行符，但不在IE中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！