如何使用jQuery在代码标记内添加pre标记？

Question

我正在尝试使用jQuery格式化代码块,特别是在<pre>标记内添加<code>标记:

$(document).ready(function() {
   $("code").wrapInner("<pre></pre>");
});

Firefox正确应用格式,但IE将整个代码块放在一行上.如果我添加提醒

alert($("code").html());

我看到IE已在pre标签中插入了一些额外的文字:

<PRE jQuery1218834632572="null">

如果我重新加载页面,jQuery后面的数字会改变.

如果我使用wrap()而不是wrapInner(),在<pre>外面包装<code>标签,IE和Firefox都能正确处理它.但是不应该在里面<pre>工作吗？ <code>

我更喜欢使用,wrapInner()因为我可以在<pre>标签中添加一个CSS类来处理所有格式,但是如果我使用wrap(),我必须将<pre>标签中的页面格式化CSS和标签中的文本/字体格式<code>,或Firefox和IE都窒息了.这不是什么大不了的事,但我想尽量保持简单.

有人遇到过这种情况么？我错过了什么吗？

Answer 1

这是块和内联元素之间的区别.pre是块级元素.将其放在code标签中是不合法的,标签只能包含内联内容.

因为浏览器必须支持他们可能在真实网络上找到的任何神奇标签汤,Firefox会尝试做你的意思.IE碰巧以不同的方式处理它,这很好的规范; 在这种情况下的行为是未指定的,因为它永远不会发生.