网站的语法荧光笔[关闭]答案

【问题标题】：Syntax Higlighter For Site [closed]网站的语法荧光笔[关闭]
【发布时间】：2018-01-24 02:10:21
【问题描述】：

我正在尝试制作一个网站。但我需要制作一个语法高亮程序，根据命令对它们进行分类。例如，一组是 I/O，另一组是控制命令。你会根据它是什么类型的命令为文本着色。请我需要帮助。

<html>
<head>
<div class=“io”>Text goes here</div>
div.io {
color: #0A0A0A;
</head>
<!--
PREFIX = 'lang/'
SUFFIX = '.js'
-->
 <body onload="sh_highlightDocument('lang/', '.js');">

<!--
 CLASS = 'sh_java'
 PREFIX + CLASS + SUFFIX = 'lang/' + 'sh_java' + '.js'
                    = 'lang/sh_java.js'
 -->
 <pre class="sh_java">
 public class X {}
 </pre>

  </body>
 </html>

【问题讨论】：

太棒了！现在您的问题是什么？ StackOverflow 是一个问答网站，您似乎没有包含一个。请在minimal, complete, and verifiable example 中明确指出您遇到的具体问题。如需更多信息，请参阅有关how to ask good questions 的帮助文章，并采取tour of the site :)
请说明您的问题。这看起来如何，哪些类别？应该改变什么颜色？文字颜色，背景颜色？如果可能，请提供代码 sn-p！
文字颜色需要改变。请帮忙
哪些文字颜色需要改变？ 什么时候文本应该改变颜色？文本应该变成什么颜色？你有什么already tried 让文字变色？
我需要将 I/O 文本更改为红色，命令变为绿色

标签： javascript html css

【解决方案1】：

上面的代码有几个问题：

你在<head>部分写你的<div>，即invalid HTML
您在 <div> 类声明中使用了卷曲的 “ ” 引号，这不起作用

除此之外，您的问题非常模糊。您的问题中似乎没有任何“控制命令”。

话虽如此，它听起来就像您试图将 io 类中的文本变为红色，而将 control-commands 类中的一些附加内容变为绿色。

这可以通过 JavaScript 的 .getElementsByClassName() 方法和 .style 属性来完成，如下所示：

function change() {
  document.getElementsByClassName('io')[0].style.color = 'red';
  document.getElementsByClassName('control-commands')[0].style.color = 'green';
}

<div class='io'>IO</div>
<div class='control-commands'>Control Commands</div>
<br />
<button onclick="change()">Change</button>

请记住，.getElementsByClassName 返回一个节点列表，因此您需要使用上面的[0] 访问它的第一个索引。

希望这会有所帮助！

【讨论】：

非常感谢 Obsidian Age，你真是个了不起的人:)