【问题标题】:How to implement .indexof for an array of strings?如何为字符串数组实现 .indexof?
【发布时间】:2012-10-06 01:24:20
【问题描述】:

如何简化以下代码?如何摆脱 if 语句?我想突出显示 ajax 响应中的一些行。现在我有两个要比较的字符串=两个ifs。这个数字会增加,所以我正在考虑以其他方式执行此操作 - 使用需要突出显示的字符串数组,以防字符串是 data_array 元素的一部分。

我更喜欢仅使用 javascript 的解决方案,但 jQuery 也可以。

    data_array=data.split('<BR>');
    for(var i=0, len=data_array.length; i < len; i++){
        if (data_array[i].indexOf('Conflict discovered') >= 0){
            data_array[i]="<span class='red'>"+data_array[i]+"</span>";
        }   
        if (data_array[i].indexOf('Syntax error') >= 0){
            data_array[i]="<span class='red'>"+data_array[i]+"</span>";
        }   
    }
    data=data_array.join('<BR>');

【问题讨论】:

  • @Ibu,你就是我们不能拥有美好事物的原因。
  • @Ibu javascript = 浏览器。 jQuery = 32KB
  • @ibu - jquery != javascript。 “但 jQuery 也可以”意味着使用 jQuery 方法的解决方案是可以接受的

标签: javascript jquery arrays string-matching


【解决方案1】:

为什么不添加另一个for 循环?

data_array=data.split('<BR>');

var stringsToFind = ['Conflict discovered', 'Syntax error'];

for (var i = 0; i < data_array.length; i++) {

    for (var j = 0; j < stringsToFind.length; j++) {

        var currItem = data_array[i];

        if (currItem.indexOf(stringsToFind[j]) >= 0) {

            data_array[i]='<span class="red">' + currItem + '</span>';
        }
    }  
}

data = data_array.join('<BR>');

jQuery(注意,可能会比较慢,我还没有测试过)

data_array=data.split('<BR>');

var stringsToFind = ['Conflict discovered', 'Syntax error'];

$.each(data_array, function(i, item) {
    $.each(stringsToFind, function(j, s) {
        if (item.indexOf(s) >= 0) {
            data_array[i]='<span class="red">' + item + '</span>';
        }
    }
});

data = data_array.join('<BR>');

【讨论】:

  • 除此之外,我会使用 jQuery.each,这是一种更好的迭代形式。
  • @Anderson Silva:没错,但如果 R​​adek 不想要 jQuery 库,这将是纯 JavaScript 解决方案。
  • 您能否在回答中添加.each 的样本以便我接受?
  • @Radek 检查我不使用任何循环的答案
  • 是的,但我最喜欢你的。对不起@Laurence。
【解决方案2】:

根据需要向数组中添加更多元素 :)

data.replace( /<br>/ig, '\n' ).replace(
    new RegExp( '^(.*(?:' + [
          'Conflict discovered'
        , 'Syntax error'
    ].join( '|' ) + ').*)$', 'gm' )
, '<span class="red">$1</span>' ).replace( /\n/g, '<br>' );

解释:

  • 用换行符替换&lt;br&gt;标签
  • 制作一个正则表达式:^(.*(?:Conflict discovered|Syntax error).*)$
  • 环绕匹配 &lt;span class="red"&gt; ... &lt;/span&gt;
  • 将换行符转回&lt;br&gt;标签

【讨论】:

  • 这是span 数组中的文本还是&lt;br&gt; 之间的全部文本?
  • 是的,这是我们想要的。 :-) 但我自己无法从代码中弄清楚。所以我问了。
  • 是的,这就是^(.* ... .*)$ 的用途,以匹配整行
  • 为什么必须用新行替换
    ?我想我可以用变量名替换 ['Conflict found' ],不是吗。
  • 因为 ^$ 匹配行的开头和结尾。没有它,我需要使正则表达式过于复杂才能找到&lt;br&gt; 标签之间的整行。是的,您可以将[ ... ] 替换为变量。是的,如果这很重要,那就是“一条线”
【解决方案3】:
var data_array = data.split('<BR>');
var errMsgs = ['Conflict discovered', 'Syntax error'];
data_array = data_array.map(function(data_rec) {
    var isAnError = errMsgs.some(function (errMsg) {
        return data_rec.indexOf(errMsg) >= 0;
    });
    if (isAnError) {
        return "<span class='red'>" + data_rec + '</span>';
    } else {
        return data_rec;
    }
});

【讨论】:

【解决方案4】:

jsBin demo

var highlightWords = ['Conflict discovered', 'Syntax error', 'Simply cool'];

for(i=0; i<highlightWords.length; i++){
  var regex = new RegExp(highlightWords[i],'ig');
  data= data.replace( regex, '<span class="red">'+ highlightWords[i] +'</span>');
}

$('div').html( data );


jsBin demo 2 all line highlight

var words = ['Conflict discovered', 'Syntax error', 'Strange'];
var data_array=data.split('<BR>');

for(n=0;n<words.length;n++){
  for(i=0; i<data_array.length; i++){
      if (data_array[i].indexOf( words[n] ) >= 0){
           data_array[i]="<span class='red'>"+data_array[i]+"</span>";
      }   
  }
  data = data_array.join('<BR>');
}

$('div').html( data );

【讨论】:

  • 您的代码仅突出显示(错误)字符串。挖掘从

    定义的整行。不过我喜欢。我学到了一些新东西。
  • 我也非常喜欢您的解决方案。实际上它可能比@cwolves 的更容易阅读。
  • @Radek 谢谢!我很高兴能帮上忙!
【解决方案5】:
data_array=data.split('<BR>');
for(var i=0, len=data_array.length; i < len; i++){
    var dai = data_array[i];
    if (dai.indexOf('Conflict discovered') >= 0 || dai.indexOf('Syntax error') >= 0){
        data_array[i] = "<span class='red'>"+dai+"</span>";
    }   
}
data=data_array.join('<BR>');

【讨论】:

  • 是的:-) 但是拥有一个我修改的数组而不是引入新的ifor 会不会更容易?我有一个配置文件,我希望这样的数组包含在其中。
  • @Radek,查看 .map 和 .forEach
猜你喜欢
  • 2011-09-09
  • 2021-12-02
  • 1970-01-01
  • 1970-01-01
  • 2011-04-09
  • 1970-01-01
  • 2016-08-02
  • 1970-01-01
  • 2020-08-16
相关资源
最近更新 更多