Question

我当前使用以下脚本来查找和替换我网站上的文字。

$("#content #tablelabel p").text(function (_, ctx) { return ctx.replace("Check In", "入住"); });

但是有数百个单词需要查找和替换。其中一些共享相同的CSS路径。你能告诉我如何优化该脚本并创建一个函数来传递CSS路径和单词来查找和替换所以我可以消除重复相同的脚本吗？

也可以通过替换文本传递多个单词来查找。例如没有写

$("#content #tablelabel p").text(function (_, ctx) { return ctx.replace("Room Type", "入住"); });
$("#content #tablelabel p").text(function (_, ctx) { return ctx.replace("Guests", "退房"); });

我可以这样做吗

$("#content #tablelabel p").text(function (_, ctx) { return ctx.replace({'Room Type': '房间类型','Guests': '房间类型'}); });

由于

Answer 1

您可以迭代对象并替换其中的所有值，如

＆＃13;

var tags = {
  'Room Type': '入住',
  'Guests': '退房'
};
$("#content #tablelabel p").text(function(_, ctx) {
  $.each(tags, function(tag, text) {
    ctx = ctx.replace(tag, text);
  })
  return ctx;
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="content">
  <div id="tablelabel">
    <p>Room Type</p>
    <p>Guests</p>
  </div>
</div>

＆＃13;

Answer 2

不久前，我有同样的愿望。

考虑这种用法（我发现它更强大，更灵活）：

//USAGE:
var pattern = [
    {
        selectors : ["p",".metoo","em"],
        find      : ["set", "me", "free"],
        replace   : ["#set#", "@me@", ">free<"] 
    },
    {
        selectors : ["h5"],
        find      : ["I", "quick", "easy"],
        replace   : ["^ $1 ^"]                      //$1 is a token to use matched value
    }
];

replaceText(pattern);

正如您所看到的，该函数接受Array个定义元素组的对象，要查找的文本和替换。你可以设置任意多个。

一些注意事项：

$1 - 将替换为匹配的值。
replace数组必须至少包含一个值 - 每个匹配的文本将被前一个匹配的replace文本替换。

JSnippet Demo

以下是实现该功能的函数：

var replaceText = function(pat) {
    var ret = [];
    for (var i = 0; i < pattern.length; i++) {
        $(pattern[i].selectors.join(",")).text(function(ind,txt){  
            for (var j=0; j < pattern[i].find.length; j++) {
                if (typeof pattern[i].replace[j] !== 'undefined') {
                    rep = pattern[i].replace[j].replace("$1", pattern[i].find[j]);
                } else if (pattern[i].replace.length) {
                    rep = pattern[i].replace[pattern[i].replace.length-1].replace("$1", pattern[i].find[j]);
                } else { continue; }
                txt = txt.replace(pattern[i].find[j], rep);
            }
            return txt;
        });
    }
};

Answer 3

$("#content #tablelabel p").text( function (_, ctx) {    
  return ctx.replace('Room Type','房间类型').replace('Guests','房间类型');   
});

查找和替换jQuery函数

3 个答案: