Question

结合使用PrismJS和TypeIt，我发现突出显示=或||并在其周围放置一个灰色框的问题。有没有办法忽略这些字符？

var codeBlock = document.getElementById('code');

var codeSample =
  '\x0a\x66\x72\x6f\x6d\x20\x63\x6f\x64\x65\x73\x70\x65\x6e\x74\x2e\x64\x65\x76\x20\x69\x6d\x70\x6f\x72\x74\x20\x70\x72\x6f\x6a\x65\x63\x74\x73\x0a\x0a\x64\x65\x76\x65\x6c\x6f\x70\x65\x72\x20\x3d\x20\x27\x43\x6f\x64\x65\x53\x70\x65\x6e\x74\x27\x0a\x0a\x64\x65\x66\x20\x73\x74\x61\x72\x74\x5f\x70\x6f\x72\x74\x66\x6f\x6c\x69\x6f\x28\x64\x65\x76\x65\x6c\x6f\x70\x65\x72\x29\x3a\x0a\x20\x20\x20\x20\x70\x6f\x72\x74\x66\x6f\x6c\x69\x6f\x20\x3d\x20\x7b\x7d\x0a\x20\x20\x20\x20\x66\x6f\x72\x20\x70\x72\x6f\x6a\x20\x69\x6e\x20\x70\x72\x6f\x6a\x65\x63\x74\x73\x3a\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x70\x72\x6f\x6a\x5b\x27\x61\x75\x74\x68\x6f\x72\x27\x5d\x20\x3d\x20\x64\x65\x76\x65\x6c\x6f\x70\x65\x72\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x70\x6f\x72\x74\x66\x6f\x6c\x69\x6f\x5b\x70\x72\x6f\x6a\x2e\x6e\x61\x6d\x65\x5d\x20\x3d\x20\x70\x72\x6f\x6a\x0a\x20\x20\x20\x20\x72\x65\x74\x75\x72\x6e\x20\x70\x6f\x72\x74\x66\x6f\x6c\x69\x6f\x0a\x0a\x64\x65\x66\x20\x6f\x70\x65\x6e\x5f\x70\x6f\x72\x74\x66\x6f\x6c\x69\x6f\x28\x70\x6f\x72\x74\x66\x6f\x6c\x69\x6f\x2c\x20\x72\x65\x71\x75\x65\x73\x74\x29\x3a\x0a\x20\x20\x20\x20\x70\x72\x6f\x6a\x65\x63\x74\x73\x20\x3d\x20\x70\x6f\x72\x74\x66\x6f\x6c\x69\x6f\x0a\x20\x20\x20\x20\x63\x6f\x6e\x74\x65\x78\x74\x20\x3d\x20\x7b\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x27\x70\x72\x6f\x6a\x65\x63\x74\x73\x27\x3a\x70\x72\x6f\x6a\x65\x63\x74\x73\x2c\x0a\x20\x20\x20\x20\x7d\x0a\x20\x20\x20\x20\x72\x65\x74\x75\x72\x6e\x20\x72\x65\x6e\x64\x65\x72\x28\x72\x65\x71\x75\x65\x73\x74\x2c\x20\x27\x70\x6f\x72\x74\x66\x6f\x6c\x69\x6f\x2e\x68\x74\x6d\x6c\x27\x2c\x20\x63\x6f\x6e\x74\x65\x78\x74\x29'

setTimeout(() => {

  const instance = new TypeIt('#code', {
    strings: [codeSample],
    speed: 60
  }).go();

}, 1000)

setInterval(function() {

  const code = Prism.highlight(codeBlock.innerText, Prism.languages.python, 'python');
  document.getElementById('real-code').innerHTML = code;
}, 10); <
/script>

body {
  background-color: rgb(34, 32, 35);
  color: #fff;
}

#code {
  display: none;
}

<head>
  <!-- Prism 1.16.0 Highlighting -->
  <script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.16.0/components/prism-core.js"></script>
  <link href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.16.0/themes/prism.css" rel="stylesheet" type="text/css" />
  <script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.16.0/components/prism-python.js"></script>

  <link href="https://raw.githubusercontent.com/PrismJS/prism-themes/master/themes/prism-vs.css" type="text/css" rel="stylesheet">

  <!-- TypeIt 6.0.2 Typewriter -->
  <script src="https://cdn.jsdelivr.net/npm/typeit@6.0.2/dist/typeit.min.js"></script>
</head>

<pre>
      <code id="real-code"></code>
    </pre>

<div id="code" class="language-py"></div>

棱镜忽略字符？

0 个答案: