javascript - 如何使用 JavaScript 为 pre 元素中的代码设置样式？

Question

如何突出显示 pre 元素内的代码？已经有关于突出显示它的问题，但答案都在 JQuery 中。是否可以在没有标签的情况下做到这一点，它是 JavaScript 中的 id 而不是 JQuery。我不希望整个代码块是相同的颜色我希望每个标签打开和标签关闭都是一种颜色，标签值是另一种颜色，属性和它的值是另一种颜色。

Answer 1

document.getElementById("idofpre").style.color="#99999";

Answer 2

你试过这个吗？

document.getElementById("the_id_of_pre_block").style.property="value";

上面的代码将获取元素的 ID 并更新样式。第二件事你也可以使用 TagName：

document.getElementsByTagName("pre").style.property="value";

或者，您可以使用 jQuery（更简单的方式，但不是您的方式）来设置内容的样式。使用这个：

$(document).ready(function() {
  $('pre').css('background-color', '#anyhexcode');
});

这将更改background-color放置在pre块内的所有文本。这就是你可以用 JavaScript 做的事情。

还有一件事：

你正在使用onload=hightlight()，但你有一个功能，colorize()你确定这很好吗？我认为你需要改变它！