如何在我的小脚本中跳过计算和着色的whitespacing? 它在我的脚本中计算并着色,我没有线索如何跳过它,而不是影响角色。所以关键是要为每个第二个字母着色。有什么提示吗?
我知道如何使用jQuery,但我正在练习JavaScript。
var div = document.createElement('div'),
first = 'First JavaScript string.',
second = 'This is second text.',
combine = first + ' ' + second,
colored = '';
div.id = 'sort-text';
document.getElementsByTagName('body')[0].appendChild(div);
for (i = 0; i < combine.length; i++) {
if (i % 2 == 1) {
colored += '<span style="color: #d10;">' + combine[i] + '</span>';
} else {
colored += combine[i];
}
}
div.innerHTML = colored;
答案 0 :(得分:2)
试试这个:
var space_offset = 0;
for (i = 0; i < combine.length; i++) {
if ( combine[i] == ' ' ) {
space_offset++;
colored += combine[i];
} else if ( ( i + space_offset ) % 2 == 1) {
colored += '<span style="color: #d10;">' + combine[i] + '</span>';
} else {
colored += combine[i];
}
}
我添加了一个偏移量变量,可以保持忽略空格的每个其他字母都应该着色。
答案 1 :(得分:2)
您可以列出您不想计算的内容,例如空格,并使用单独的变量而不是依赖于字符索引。
var useRed = false;
for (i = 0; i < combine.length; i++) {
if (combine[i] != ' ') {
if (useRed) {
colored += '<span style="color: #d10;">' + combine[i] + '</span>';
useRed = false;
} else {
colored += combine[i];
useRed = true
}
}
else {
colored += combine[i];
}
}
这是fiddle。
答案 2 :(得分:2)
我建议你使用map。对于这个问题,它比for循环要干净得多。
例如:
var curr = -1;
colored = combine.split("").map(function(x) {
if (x === " ") return x; // Ignore space
curr++; // Otherwise, increment
if (curr % 2 === 1)
return '<span style="color: #d10;">' + x + '</span>';
return x;
}).join("");
您可以轻松扩展此功能,以包含其他标点符号和模式。
例如,如果我们想忽略句点和空格,我们可以这样做:
var curr = -1;
var ignore = ". "; // Ignore space and period
colored = combine.split("").map(function(x) {
if (ignore.indexOf(x) >= 0) return x;
curr++;
if (curr % 2 === 1)
return '<span style="color: #d10;">' + x + '</span>';
return x;
}).join("");
答案 3 :(得分:1)
似乎是continue
的任务:
var i, len, str, bol, curr_char, new_str;
str = "hello wolrd this is a test.";
new_str = "";
bol = false;
for(i=0, len=str.length; i<len; i++){
curr_char = str.charAt(i);
if(curr_char===" "){
new_str += curr_char;
continue;
}
if(bol){
new_str += "<span style='color: #d10;'>" + curr_char + "</span>";
}else{
new_str += curr_char;
}
bol = !bol;
}
console.log(new_str);
答案 4 :(得分:1)
这是另一种选择:
var i, len, old_str, new_str, color_toggler, current_char, is_space;
old_str = "hello world this is a test.";
new_str = "";
color_toggler = true;
for(i=0, len=old_str.length; i<len; i++){
current_char = old_str.charAt(i);
is_space = (current_char===" ");
if(!is_space){
color_toggler = !color_toggler;
}
if(color_toggler || is_space){
new_str += current_char;
}else{
new_str += "<span style='color: #d10;'>" + current_char + "</span>";
}
}
console.log(new_str);