我从数据库中获得了一些降价文本。我正在使用Showdown.js将此降价转换为HTML:
var showdown = new Showdown.converter();
var str = showdown.makeHtml(myDatabaseString);
当markdown中嵌入代码时,Showdown.js会很好地将其包装到<pre><code>
标记中,因此str
可能如下所示:
<p>Some text bla</p><pre><code>Some code</pre></code><p>Text again</p>
现在我希望通过使用SyntaxHighlighter突出显示代码片段的语法来使事情变得更漂亮。重要的是,最后我得到一个包含之前所有内容的字符串,以及用于格式化的附加HTML。
我的方法是JQuery操纵DOM的能力:
$(str).each(function() {
// or can I select only pre within $(str) directly?
// everything I tried so far to do that failed miserably
if($(this).is('pre')) {
var code = $('code', $(this)).text();
// brush is my SyntaxHighlighter brush that I created earlier
$('code', $(this)).text(brush.getHtml(code));
// when I console.log($('code', $(this))) now, everything worked
// out perfectly
}
});
// but now I lost all my changes for some reason :-(
return str; // I need to return this as a string again
我是正确的吗?如何在.each
循环中保留我所做的更改?
答案 0 :(得分:3)
那是因为你正在创建一个与str
变量无关的jQuery对象,你应该使用创建的jQuery对象。实际上,您正在修改创建的jQuery对象的元素并返回原始/未更改的str
变量。我建议:
// Creating a wrapper element
// and setting it's content by using str variable
var $wrapper = $('<div/>').html(str);
// Modifying descendant pre elements
$wrapper.find('pre').each(function(){
// implementing the logic
});
// Getting modified HTML content of the created wrapper element
str = $wrapper.html();