JS，评论之间标明内容

Question

我有我的代码一些意见，这样的：

<!-- DebugDataTemplateBegin {"template":"one"} --> 
<div class="row notices" id="admin"> 
    comment One content 
</div> 
<!-- DebugDataTemplateEnd {"template":"one"} --> 

<!-- DebugDataTemplateBegin {"template":"two"} --> 
<div class="row notices" id="admin"> 
    comment Two content 
</div> 
<!-- DebugDataTemplateEnd {"template":"two"} --> 

，我有锚这样的：

<a href="#"> one </a> <br/> 
<a href="#"> two </a> 

这些链接的内容对应的评论“模板'元素，我想要实现的是当用户将鼠标悬停在任何这些链接上时，它的对应内容（评论之间）将突出显示。

我开始了一个简单的jsfiddle例子http://jsfiddle.net/Banzay/md79aaby/，但不知道这是否可能。

对不起，如果我没有解释得很好。

Youssef

Answer 1

清理了我的上面的答案，并将其删除。

你可能不得不改变你正在寻找评论的父母。正则表达式可以使用一些爱，但这是一般的想法。

HTML：

<!-- DebugDataTemplateBegin {"template":"one"} --> 
    <div class="row notices" id="admin">comment One content</div> 
<!-- DebugDataTemplateEnd {"template":"one"} --> 
<!-- DebugDataTemplateBegin {"template":"two"} --> 
    <div class="row notices" id="admin">comment Two content</div> 
<!-- DebugDataTemplateEnd {"template":"two"} --> 
<a href="#one"> one </a> 
<br/> 
<a href="#two"> two </a> 

JS：

var getComment = function (templateName) { 
    return $("body").contents().filter(function() { 
     return this.nodeType == 8 && this.nodeValue.match(RegExp('DebugDataTemplateBegin.*'+templateName)); 
    }) 
} 

$('a').hover(function() { 
    var templateName = this.href.split('#')[1]; 
    var comment = getComment(templateName); 
    var element = $(comment).next(); 
    element.toggleClass('highlight'); 
}) 

http://jsfiddle.net/md79aaby/18/