【问题标题】:Javascript-Add style to the first value matched in an array and discard the othersJavascript-将样式添加到数组中匹配的第一个值并丢弃其他值
【发布时间】:2016-08-31 02:01:33
【问题描述】:

我搜索了我为这个特定任务找到的在线资源,但我遇到了一些我无法通过它们获得帮助的东西。 我正在尝试找到一种方法来为数组中的第一个匹配字母添加样式并丢弃剩余的匹配字母。例如,假设我有一个名为“disabledDouble”的搜索字符串。我在字符串上使用 split() 方法将匹配的元素与不匹配的元素分开:

search: function(){
 var search = "d";
 var string = "disabledDouble";
 var regex = new RegExp("(" + search + ")", "gi");
 var segments = string.split(regex); //o/p :["d", "isable", "d","D","ouble"]
 return (
      //styled element <span>
    )

}

现在我只想将样式添加到数组中的第一个“d”(不用担心第二个或第三个“d”)并加入剩余的字符串,使得 o/p 变为:

disabledDouble

同样,由于字符串是动态创建的,因此我的值如下:

s稳定性如何

a访问值

在上述所有情况下,我只想将样式添加到第一个匹配的值。 有什么想法???

【问题讨论】:

  • 你的问题很不清楚,你想处理第一个字符还是需要搜索一个特殊的pttern来改变一些东西?如果您只想更改字符串的第一个字符,则可以使用替换。
  • 据我所知,您无法使用 CSS 设置单个字符的样式。您需要将它们包装在它们自己的元素中,例如跨度并以这种方式应用样式。有关详细信息,请参阅此stackoverflow.com/questions/24705721/…

标签: javascript


【解决方案1】:

你可以使用替换

var search = "d";
var string = "disabledDouble"
var regex = new RegExp(search, "i");
console.log(string.replace(regex, function(a) {return "<span>" + a + "</span>";}));

【讨论】:

  • 没有办法在返回 o/p 时不具有 ..:我尝试将类添加到 span 并对其进行样式化..doesnt 工作...在 o/p 返回showStatus jsfiddle.net/xzug4yns
  • 我不确定。您需要跨度(或像其他答案一样强大)。像这样:jsfiddle.net/xzug4yns/1
【解决方案2】:

假设,您只想更改第一个字符。

var string = 'abracadabra';

console.log(string.replace(/./, '<strong>$&</strong>'));

【讨论】:

  • 好吧..我想根据搜索字符串值设置字符样式...如果搜索字段中的值为“a”,我会得到一个包含字母“a”的单词列表:eg: value,access,allowance..在所有情况下,我只想设置第一次出现在单词中的“a”的样式..例如在“allowance”中,只设置 alowance .希望这个是清楚的
  • 请将用例添加到您的问题中。但我仍然不清楚你想要什么。
猜你喜欢
  • 2018-03-24
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2019-01-04
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多