使用 highlight.js CDN答案

【问题标题】：Using highlight.js CDN使用 highlight.js CDN
【发布时间】：2021-01-15 05:01:35
【问题描述】：

我似乎无法让语法突出显示与 highlight.js 一起使用。这是一个测试示例：

<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/10.5.0/styles/default.min.css">
    <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/10.5.0/highlight.min.js"></script>
    <script>hljs.initHighlightingOnLoad();</script>
    <title>Test Highlight</title>
  </head>
  
  <body>
    <pre>
        <code class="language-python">
          def f(x, y):
            return x + y
        </code>
    </pre>
  </body>
</html>

我包含了 CSS 和 JS CDN 并调用了 hljs.initHighlightingOnLoad()，但代码仍然完全以黑色文本显示：

我做错了什么？

【问题讨论】：

标签： html syntax-highlighting cdn highlight.js

【解决方案1】：

您的链接和脚本标签 URL 中有错字。

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.5.0/styles/default.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.5.0/highlight.min.js"></script>

<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.5.0/styles/default.min.css">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.5.0/highlight.min.js"></script>
    <script>hljs.initHighlightingOnLoad();</script>
    <title>Test Highlight</title>
  </head>
  
  <body>
    <pre>
        <code class="language-python">
          def f(x, y):
            return x + y
        </code>
    </pre>
  </body>
</html>

【讨论】：