0

我有一个小问题 - 我想用 H1 元素中的图像替换字符“K”和“k”。

我已经尝试过了，它对一个角色非常有效：

$(function() {
    $("h1").each(function() { 
        if($(this).children().length==0) { 
            $(this).html($(this).text().replace('K', '<img src="http://www.fotograf-in-frankfurt.biz/img/v2013/k_cap.png" style="display:inline-block;" alt="K">'));
        } 
    });
});

这个对于大写的“K”来说效果很好，但是现在我也想替换较低的那个 - 所以我尝试了这个：

$(function() {
    $("h1").each(function() { 
        if($(this).children().length==0) { 
            $(this).html($(this).text().replace('K', '<img src="http://www.fotograf-in-frankfurt.biz/img/v2013/k_cap.png" style="display:inline-block;" alt="K">').replace('k', '<img src="http://www.fotograf-in-frankfurt.biz/img/v2013/k_low.png" style="display:inline-block;" alt="k">'));
        } 
    });
});

结果最终看起来有点令人毛骨悚然 - 像这样：

furt.biz/img/v2013/k_cap.png" style="display:inline-block;" alt="K">ontakt & Terminvereinbarung

但它应该更像这样替换字符：

Kontakt & Terminvereinbarung

我很确定我犯了一个错误，也许是个白痴，但在哪里？

非常感谢你的帮助！

4

3 回答 3

2

与函数string.replace一起用作第二个参数。这将匹配作为参数接收，并返回替换它的值。这使您可以一次完成所有操作，因此您无需重新处理第一遍的输出。

str.replace(/k/ig, function(char) {
    switch(char) {
        case 'K':
           return '<img src="http://www.fotograf-in-frankfurt.biz/img/v2013/k_cap.png" style="display:inline-block;" alt="K">';
           break;
        case 'k':
           return '<img src="http://www.fotograf-in-frankfurt.biz/img/v2013/k_low.png" style="display:inline-block;" alt="k">';
           break;
     }
});

您还需要使用带有g修饰符的正则表达式来替换所有实例。当您使用字符串或不带 的正则表达式时g，它只会进行一次替换。

于 2013-05-27T00:13:30.253 回答
0

您似乎还替换了图像标签内部的“k”，例如 fran* k *furt。您可以首先用“UPPERREP”替换所有大写字母K，用“LOWERREP”替换所有小写字母，然后用图像替换。这样，您可以避免在添加第二个图像元素时破坏、替换或完全摆脱第一个图像元素。

于 2013-05-27T00:06:31.233 回答
-1

您还将 HTML 代码的内部字母替换为 k 和 K，请执行以下操作。

str=[your string].replace('K', '!!__Big__!!').replace('k', '!!__Small__!!');
str=str.replace("!!__Big__!!", "[code here]").replace("!!__Small__!!","[Code here]");
于 2013-05-27T00:08:57.013 回答