var toR; // 创建一个CSS元素以包含所有颜色样式 var style = document.createElement('style'); style.type = 'text/css'; style.innerHTML = `.pink{ color: #FF237A; display: inline-block; } .purple{ color: #AE60F6; display: inline-block; } .blueItal{ color: #6DC5FB; display: inline-block; font-style: italic; } .blue{ color: #6DC5FB; display: inline-block; } .green{ color: #A6E06C; display: inline-block; } .yellow{ color: #F3E688; display: inline-block; } .grey{ color: #B0B0B0; display: inline-block; } .code{ font-size: 14px; color: white; background: #363838; } // 不要更改这些内容 div{ margin: 0; } .code{ padding: 5px; display: block; } `; document.getElementsByTagName('head')[0].appendChild(style); // 高亮所有代码块 function highlightAll(){ var allCodes = document.getElementsByTagName("code"); for (var i = 0; i < allCodes.length; i++) { allCodes[i].className = "code"; allCodes[i].innerHTML = highlight(allCodes[i].innerHTML); } } window.onload = highlightAll; // 如果不希望一开始就高亮代码,请禁用此行 // 高亮代码 function highlight(toH){ toR = toH; toR = replSymb(toR); toR = replace(toR, "\n", "
"); functions(); // 高亮所有函数 colorW(["=","+","-","*","|","^","%","$","<",">","&"],"pink"); // 使所有操作符变为粉色 colorW(["0","1","2","3","4","5","6","7","8","9","#"], "purple"); // 使所有数字变为紫色 colorW(["if","else","return","while","for"],"pink"); // 使所有循环关键字变为粉色 colorW(["function","var","document","console"], "blueItal"); // 使所有特殊单词变为斜体蓝色 quotes(); // 使所有字符串变为黄色 comments(); // 使所有注释变为灰色 toR = replace(toR, " ", "  "); return toR; } // 替换字符串中的字符 function replace(toConv, dontWant, doWant){ var tempList = toConv.split(dontWant); return tempList.join(doWant); } // 替换一些特殊字符,以避免与HTML混淆 function replSymb(st){ var toR = st; toR = replace(toR, `&`,"&");// 替换符号以避免与HTML混淆 toR = replace(toR, `=`,"="); toR = replace(toR, `"`,"""); toR = replace(toR, `<`,"<"); toR = replace(toR, `>`,">"); return toR; } // 为特定单词着色 function colorW(words, color){ for (var i = 0; i < words.length; i++) { toR = toR.split(words[i]); toR = toR.join("
"+words[i]+"
"); // 用带颜色的
包裹单词 } } // 为字符串添加黄色高亮 function quotes(){ toR = toR.split("""); for (var i = 1; i < toR.length; i+=2) { toR[i] = "
""+toR[i]+""
"; } toR = toR.join(""); } // 为注释添加灰色高亮 function comments(){ toR = toR.split("
"); for (var i = 0; i < toR.length; i++) { if(toR[i].split("//").length > 1){ // 注释为灰色 toR[i] = toR[i].split("//")[0] +"
//"+ toR[i].split("//")[1] + "
"; } } toR = toR.join("
"); } // 高亮函数名 function functions(){ toR = toR.split("("); for (var i = 0; i < toR.length-1; i++) { var lastWord = toR[i]; lastWord = lastWord.split(" ")[lastWord.split(" ").length-1]; lastWord = lastWord.split("
")[lastWord.split("
").length-1]; // 换行 lastWord = lastWord.split(".")[lastWord.split(".").length-1]; // ( 前的最后一个单词 var secondLast = toR[i].slice(0,-lastWord.length-1); secondLast = secondLast.split(" ")[secondLast.split(" ").length-1]; secondLast = secondLast.split("")[secondLast.split("").length-1]; // 换行 secondLast = secondLast.split(".")[secondLast.split(".").length-1]; // ( 前的倒数第二个单词 if(secondLast == "function"){ // 如果前一个单词是 "function",则表示正在定义函数,所以将其着色为绿色 toR[i] = toR[i].slice(0,toR[i].length-lastWord.length) + "
"+lastWord+"
"; }else{ toR[i] = toR[i].slice(0,toR[i].length-lastWord.length) + "
"+lastWord+"
"; } }; toR = toR.join("("); }