Javascript用数组替换括号之间的文本

时间:2017-05-14 13:21:28

标签: javascript

我想用方括号内的文本替换数组的值。

示例:

<pre id="text">
[maybe] i should [leave]
[to] help you [see]
[nothing] is [better] [than] this
[and] this is [everything] we need
</pre>

会变成这样的

<pre id="text">
[why] i should [go]
[from] help you [run]
[that] is [nothing] [from] this
[now] this is [as] we need
</pre>

请帮帮我..谢谢

&#13;
&#13;
var arr = ['why', 'go', 'from', 'run', 'that', 'nothing', 'from', 'now', 'as']
var i = 0;
$("#text").each(function() {
  $(this).text($(this).text().replace(/\[(.+?)\]/, "["+arr[i]+"]"));
	i++;
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<pre id="text">
[maybe] i should [leave]
[to] help you [see]
[nothing] is [better] [than] this
[and] this is [everything] we need
</pre>
&#13;
&#13;
&#13;

5 个答案:

答案 0 :(得分:2)

标签中的每一行都不会调用

.each()。它被调用于类中的每个元素或来自标记名称的每个元素。请阅读文档here中有关.each()的详情。

以下是摘录:

$(document).ready(function() {
  var arr = ['why', 'go', 'from', 'run', 'that', 'nothing', 'from', 'now', 'as']
  var text = $("#text").text();
  var count = -1;
  $("#text").text(text.replace(/\[(.*?)\]/g, function() {
    count = count + 1;
    return "["+arr[count]+"]"
  }));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<pre id="text">
[maybe] i should [leave]
[to] help you [see]
[nothing] is [better] [than] this
[and] this is [everything] we need
</pre>

答案 1 :(得分:1)

您可以使用包含要替换的单词的对象,而不是数组。如果找到一个单词,则使用相应的值进行替换。

var words = { maybe: 'why', leave: 'go', to: 'from', see: 'run', nothing: 'that', better: 'nothing', than: 'from', and: 'now', everything: 'as' },
    text = document.getElementById('text');

text.innerHTML = text.innerHTML.replace(/\[([^\]\[]+)\]/g, function (_, k) {
    return '[' + words[k] + ']';
});
<pre id="text">
[maybe] i should [leave]
[to] help you [see]
[nothing] is [better] [than] this
[and] this is [everything] we need
</pre>

此版本依赖于项目的顺序并以相同的顺序替换。

function replacer (array) {
    var i = 0;
    return function () {
        return '[' + array[i++] + ']';
    };
}

var words = ['why', 'go', 'from', 'run', 'that', 'nothing', 'from', 'now', 'as'],
    text = document.getElementById('text');

text.innerHTML = text.innerHTML.replace(/\[([^\]\[]+)\]/g, replacer(words));
<pre id="text">
[maybe] i should [leave]
[to] help you [see]
[nothing] is [better] [than] this
[and] this is [everything] we need
</pre>

答案 2 :(得分:0)

function change_words( replace_arr, text ){
   let i = 0;
   return text.replace( /\[(\w+)\]/g, word => `[${replace_arr[i++] || word}]` );
}
const text = "[maybe] i should [leave] [to] help you [see] [nothing] is [better] [than] this [and] this is [everything] we need"
const arr = ['why', 'go', 'from', 'run', 'that', 'nothing', 'from', 'now', 'as'];
console.log( change_words( arr, text ) )

答案 3 :(得分:0)

使用String.prototype.replace()功能和替换回调:

var text = document.getElementById("text"),
    arr = ['why', 'go', 'from', 'run', 'that', 'nothing', 'from', 'now', 'as'],
    count = 0;

text.innerHTML = text.innerHTML.replace(/\[([^\]\[]+)\]/g, function (m, m1) {
    return '[' + arr[count++] + ']';
});
<pre id="text">
[maybe] i should [leave]
[to] help you [see]
[nothing] is [better] [than] this
[and] this is [everything] we need
</pre>

答案 4 :(得分:0)

我试过了:

$(document).ready(function(){
        arr.forEach(function(element){  
        $("#text").text($("#text").text().replace(/\[.+?\]/, element ));
        });
});

它确实带来了没有括号的预期结果,但是当添加括号时:.replace(/\[.+?\]/, "[" + element + "]"));它不再起作用了。 (也许有人可以建议编辑这个内容)