Fix for newlines inside <pre> tags on IE8 and below

[loopj]

On IE8 and below, using innerHTML to set code inside a pre tag causes whitespace preservation to get hosed (see http://www.quirksmode.org/bugreports/archives/2004/11/innerhtml_and_t.html).

This pull request adds a fix which makes sure newlines still work on older IEs.

[ccampbell]

Does block.tagName == "CODE" need to be included here? According to that article

This causes incorrect display of whitespace in elements that ought to preserve formatting

Since code is a span element that does not preserve formatting is this necessary?

[loopj]

All good points. Maybe we should loop over all the attributes in the element and re-apply them to the new element?

[ccampbell]

Yeah, I just spent some time trying to get this working and the attributes are not the only problem. The thing is that the entire pre block needs to be recreated and replaced I think.

Using outerHTML causes the Rainbow.onHighlight call to break in good browsers. It seems that the block loses reference to itself in the DOM after calling outerHTML. I noticed this in Chrome.

It's also tricky cause

<pre data-language="javascript">code here</pre>

and

<pre>
    <code data-language="javascript">code here</code>
</pre>

and

<pre data-language="javascript">
    <code>some code here</code>
    <code>more code here</code>
</pre>

Are all supported formats.

I took some look at the competition and saw a really intense hack
https://github.com/isagalaev/highlight.js/blob/master/src/highlight.js#L535-544

I tried that, and it is closer, but for some reason I am still finding that some new lines are mysteriously absent on IE.

[ccampbell]

Closing this out for now since this fix doesn't quite work. Opened #80 to track the issue.