我如何遍历元素中的每个单词然后有条件地换行匹配？

Question

我在 ASP.NET 写我自己的博客，我使用 Gist embed 作为我的代码块。我想给代码上色以匹配特定语言在 IDE 中的显示方式。具体来说 Swift 在 Xcode.

我从一个 jsFiddle 开始，已经到了选择 "var" 并将其变成红色的地步，但是我找到的用于遍历单词并将它们换行的示例使用了 return 打破循环的值。

更新： 我在此处找到的 return 语句导致语法错误。我改编了 this post 的代码，很乐意探索替代方案。

如何遍历屏幕上的每个单词并有条件地换行？

我可以匹配一个词，但我找不到继续操作的方法。为了简单起见，我们只查找两个词，var & override。

我的代码：

var line = $('.line');

$.each(line, function(i, val){
   var value = $('.line').text();

    $("*:contains('var')").html(function(_, html) {

        return html.replace(/(var)/g, '<span style="color:red;"></span>');
    });

    $("*:contains('override')").html(function(_, html) {

        return html.replace(/(override)/g, '<span style="color:blue;"></span>');
    });
});

我的jsFiddle.

Answer 1

你有一个遍历每一行的循环，在那个循环中你在每次迭代中获取所有包含一个单词的元素，进行替换运行很多次。

进行一次迭代，它可以通过回调到 html() 来完成，因为它在内部迭代，并在同一个循环中进行替换

$('.line').html(function(_, html) {
    html = html.replace(/(var)/g, '<span style="color:red;"></span>');
    html = html.replace(/(override)/g, '<span style="color:blue;"></span>');

    return html;
});

FIDDLE

我如何遍历元素中的每个单词然后有条件地换行匹配？

How can I iterate over every word in an element and then conditionally wrap matches?

html

each

jquery

replace

contains

如何遍历屏幕上的每个单词并有条件地换行？