更改每隔一个字母字体颜色? (JavaScript) [英] Change every other letters font color? (JavaScript)
本文介绍了更改每隔一个字母字体颜色? (JavaScript)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我尝试在我的论坛上创建一个圣诞用户组,并想要使用JavaScript将用户名替换为绿色/红色模式。因此,基本上,JavaScript会将特定CSS类中的每个其他字母变成绿色,其他字母将保持红色。
I'm trying to create a Christmas user group on my forums, and would like to replace the users name with a green/red pattern using JavaScript. So basically, JavaScript would turn every other letter within a specific CSS class into green, and the others would stay red.
现在是这样: p>
So this is what it looks like now:
<span class="style6">Username</span>
我想让JavaScript变成这样:
I'd like JavaScript to turn it into something like this:
<span class="style6">
<span class="color_red">U</span>
<span class="color_green">s</span>
<span class="color_red">e</span>
<span class="color_green">r</span>
<span class="color_red">n</span>
<span class="color_green">a</span>
<span class="color_red">m</span>
<span class="color_green">e</span>
</span>
推荐答案
只要 ; span>
不包含任何HTML。
As long as your <span>
doesn't contain any HTML you could do this.
$('.style6').each(function(){
var letters = $(this).text().split('');
$(this).text('');
for(var i = 0; i < letters.length; i++){
if(i % 2 == 0){
$(this).append('<span class="color_red">' + letters[i] + '</span>');
}
else{
$(this).append('<span class="color_green">' + letters[i] + '</span>');
}
}
});
如果< span>
确实包含HMTL。
编辑:这是用jQuery BTW。不确定是否可以。
This is with jQuery BTW. Not sure if that is OK.
这篇关于更改每隔一个字母字体颜色? (JavaScript)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文