选择相邻同级而不插入文本节点

由于悲惨的情况，我收到这样的 HTML：

<p>Perform the following commands:
   <code>&gt; cd /foo</code><code>&gt; adb shell</code><code># ps</code>
</p>

我需要使代码看起来像这样：

Perform the following commands:
> cd /foo
> adb shell
# ps

我以为我会很棘手并使用CSS 相邻兄弟选择器 http://www.w3.org/TR/CSS2/selector.html#adjacent-selectors:

code + code:before { content:'\A'; white-space:pre }

...但后来我发现这甚至适用于以下内容：

<p>If you go to your <code>C:\</code> directory and run <code>dir</code> …</p>

是否有仅 CSS 的解决方案来选择相邻元素没有非元素节点的介入?

当且仅当不存在时，请随意建议 JavaScript（包括 jQuery）解决方案。

这有效：

$('code').each(function() {
    var prev = this.previousSibling;
    var next = this.nextSibling;
    if ((prev && prev.tagName === 'CODE') ||
        (next && next.tagName === 'CODE')) {
        $(this).addClass('block');
    }
});​

然后在你的 CSS 中使用.block要添加的选择器display: block以及匹配元素的任何其他所需样式。

demo at http://jsfiddle.net/alnitak/JYzGg/ http://jsfiddle.net/alnitak/JYzGg/

如果您还没有加载 jQuery，那么将其编码为纯 Javascript 会非常容易 - 如果您应该在这些元素上已经有其他类名，那么 jQuery 恰好比纯 JS 更容易添加类。