如何在console.log中顯示彩虹消息

Question

您好有一個用於rainbowtizing console.log輸出的腳本。

當我嘗試，console.log輸出原始字符串，但如果我複製此輸出在另一個console.log中，他輸出正確的顏色的消息。

你知道爲什麼嗎？

var input = document.getElementById('input'); 
 

 
input.addEventListener("blur", function() { 
 
\t var inputValue = input.value; 
 
\t var inputSplitted = inputValue.split(""); 
 
\t 
 
\t let i = 0, 
 
\t \t inputLength = inputSplitted.length; 
 
\t var newLog ='"'; 
 
\t var colors = ""; 
 
\t for(i=0; i<inputLength; i++){ 
 
\t \t // Chaque lettre est contenue dans inputSplitted[i] 
 
\t \t newLog += "%c"+inputSplitted[i]; 
 
\t \t colors += ',"color: '+randomColor()+';"'; 
 
\t } 
 
\t newLog +='"'; 
 
\t var log = newLog+colors; 
 
\t console.log(log); 
 
\t console.log("%ch%ce%cl%cl%co%c %cw%co%cr%cl%cd","color: #144143;","color: #40C71F;","color: #5B7487;","color: #E3E226;","color: #6A8693;","color: #EC8802;","color: #9D44DE;","color: #1F1C4D;","color: #92812D;","color: #7A412C;","color: #73936F;"); 
 
}); 
 

 
function randomColor() { 
 
\t var letters = 'ABCDEF'; 
 
\t var color = '#'; 
 
\t for (var i = 0; i < 6; i++) { 
 
\t \t color += letters[Math.floor(Math.random() * 16)]; 
 
\t } 
 
\t return color; 
 
}

<input type=text name=input id=input>

Answer 1

由於是在瀏覽器處理字符串只是作爲一個字符串，而不是作爲參數評論說。你必須聲明一個數組並使用console.log.apply。

看一看：

var input = document.getElementById('input'); 
 

 
input.addEventListener("blur", function() { 
 
\t var inputValue = input.value; 
 
\t var inputSplitted = inputValue.split(""); 
 
\t 
 
\t let i = 0, 
 
\t \t inputLength = inputSplitted.length; 
 
\t var newLog =''; 
 
\t var colors = ""; 
 
\t for(i=0; i<inputLength; i++){ 
 
\t \t // Chaque lettre est contenue dans inputSplitted[i] 
 
\t \t newLog += "%c"+inputSplitted[i]; 
 
\t \t colors += '||color: '+randomColor()+';'; 
 
\t } 
 
\t newLog +=''; 
 
\t var log = newLog+colors; 
 
\t var arr = log.split('||'); 
 
\t console.log.apply(console, arr); 
 
\t console.log("%ch%ce%cl%cl%co%c %cw%co%cr%cl%cd","color: #144143;","color: #40C71F;","color: #5B7487;","color: #E3E226;","color: #6A8693;","color: #EC8802;","color: #9D44DE;","color: #1F1C4D;","color: #92812D;","color: #7A412C;","color: #73936F;"); 
 
}); 
 

 

 

 
function randomColor() { 
 
\t var letters = 'ABCDEF'; 
 
\t var color = '#'; 
 
\t for (var i = 0; i < 6; i++) { 
 
\t \t color += letters[Math.floor(Math.random() * 16)]; 
 
\t } 
 
\t return color; 
 
}

<input type=text name=input id=input>

希望這個代碼將幫助你。 :)