Question

在我的网页上，我的源代码如下：

<div id="opt_3"  >A)</div>
<div id="opt_2"  >B)</div>
<div id="opt_4"  >C)</div>
<div id="opt_5"  >D)</div>
<div id="opt_1"  >E)</div>

我需要的是创建一个javascript，在运行时会采用类似这样的输入var：

Text 1 word word word this is a text 3 word word.

并将其更改为

<strong>E</strong> word word word this is a <strong>A</strong> word word.

或

abc text 4 word

并将其更改为

abc <strong>C</strong> word

我的javascript的工作是取字符串“Text X”或“text X”中的数字，查看与X的值匹配的id字段的第一个字符，并将该字符替换为“Text” X”。

我加载了jQuery。通过给我一些建议可以帮助吗？我是否需要使用javascript以及jQuery？

有人可以就如何做到这一点给我一些建议。我对javascript或jQuery不是很熟悉。

Answer 1

你应该这个

var myText = 'Lorem {0} Dolor {1} Amet is a {2} text.';

var textReplace = function(txt) {
    for (var i = 0, ii = arguments.length - 1; i < ii; i++) {
        txt = txt.replace('{' + i + '}', arguments[i + 1]);
    }
    return txt;
}

textReplace(myText, 'ipsum', 'sit', 'dummy');

此功能需要参数。第一个是要以某种方式替换的文本。其他参数将在您的文本中替换。我建议你使用带花括号的包装文本而不是Text 4或其他。

我希望这会有所帮助。

Answer 2

以下代码应完全按照您的描述执行：

var input = "Text 1 word word word this is a text 3 word word.";
input = input.toLowerCase();
var split = input.split(" ");
for(var i = 0; i < split.length; i++) {
    if(split[i].toLowerCase() == "text") {
         var num = split[i+1];
         var val = $("#opt_" + num).text();
         input = input.replace("text " + num, "<strong>" + val + "</strong>");
    }  
}
alert(input);

你可以看到它正常工作here。它将您的字符串拆分为空格，然后遍历生成的数组，查找“text”一词的出现。当它找到一个时，它会用strong标签中包含的相应元素的值替换该单词和下一个单词（根据您的说明将是一个数字）。

Answer 3

您可以使用回调函数执行不区分大小写的RegEx替换，如下所示：

function textReplace(v){
    return v.replace(/text ([0-9])/gi,function(i,e){
        return "<strong>"+$("#opt_"+e).text().substring(0,1)+"</strong>";
    });
}

示例：http://jsfiddle.net/niklasvh/pLpxN/

Answer 4

为此你需要jQuery


//get the original text
txt = $('#text-container').text();
//split the whole text by the words "Text"
// this way each string in the array arr will contain as its first member the number 
// without the splitting text
arr = txt.split('Text');
answerText = '';
for(i=0; i < arr.size(); i++){
    words=arr[i].split(' '); //split by spaces
    //the first word will be the number
    nr = words[0];
    //then we look up the corresponding option, and substitute the number
    words[0] = $('#opt_'+nr).text();
    //and rebuild the original text
    answerText += words.join(' ');
}

如何使用javascript和jQuery进行复杂的替换？

4 个答案: