Question

如何使用css和javascript更改括号中单词的颜色？例如：

I am [newbi] programmer

我希望单词newbi为红色或任何

感谢。

Answer 1

＆＃13;

var match = $('p#sample').html().match(/[^[]+(?=\])/g);
console.log(match);

$.each(match, function( index, value ) {

$('p#sample').html($('p#sample').html().replace("["+value+"]", "<span>"+value+"</span>"));
});

＆＃13;

span{
color:#F00;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<p id="sample">Iam [newbi] programmer. This is color [red] </p>

＆＃13;

试试这个

Answer 2

span{
  color:#F00;
}
Iam [<span>newbi</span>] programmer

Answer 3

你不能这样做，所以HTML本身会读取括号，并立即知道如何在其上放置某种样式，这可能需要javascript。如前所述，您可以使用<span>标记来设置文本的特定部分的样式，并为其添加一个类，以便您可以使用不同的颜色。

.red {
  color: red;
}

.blue {
  color: blue;
}

.yellow {
  color: yellow;
}

Iam <span class="red">newbi</span> programmer. <br>
<span class="blue">Iam</span> newbi programmer. <br>
Iam newbi <span class="yellow">programmer.</span> <br>
<span class="red">Iam </span><span class="blue">a newbi </span><span class="yellow"> programmer.</span>

按括号更改字体颜色

3 个答案: