javascript - jQuery：在 pre 标记之前查找注释

Question

我尝试用漂亮的打印来实现像 SO 代码高亮。如何在 pre 标签之前获得评论？

<!-- language: some -->
<pre>
...

如何在 pre 标签之前获得评论？

Answer 1

大多数网络浏览器完全忽略评论。相反，尝试做这样的事情

即使可以阅读页面上的评论，我相信以下任何一种方法都会更好，因为评论应该与代码分开。

<pre class="language">

或者

<pre data-language="language">

那么你可以使用它来访问它

$(".language")

或者

$("pre[data-language=language]")

Answer 2

它要求您遍历节点并检查nodeType并读取其 nodeValue。元素的 nodeType 为 1，注释的 nodeType 为 8。

HTML：

<p>Apple</p>
<!-- language: some -->
<pre id="one">One</pre>


<!-- language: someOther -->
<pre id="two">two</pre>


<pre id="three">three</pre>

JavaScript：

var pres = $("pre");
pres.each(
    function() {
        var prevSibling = this.previousSibling;
        var nodeValue = null;
        while (prevSibling && prevSibling.nodeType!==1) {
            if (prevSibling.nodeType === 8) {
                nodeValue = prevSibling.nodeValue;   
            }
            prevSibling = prevSibling.previousSibling;
        }        
        console.log(this.innerHTML, nodeValue);
    }
);

例子：

JSFiddle