爲什麼棱鏡語法高亮添加CSS類前面的空格？

我使用棱鏡語法高亮顯示從http://prismjs.com 爲什麼棱鏡語法高亮添加CSS類前面的空格？

如果我這樣做

<!DOCTYPE html> 
<html> 
    <head> 
     <link rel="stylesheet" type="text/css" href="prism.css"> 
     <script type="text/javascript" src="prism.js"></script> 
    </head> 
    <body> 
     <pre> 
      <code class="language-css"> 
p { color: blue } 
      </code> 
     </pre> 
    </body> 
</html>

我看到在我的Chrome瀏覽器開發工具以下結果：

<html> 
    <head> 
     <link rel="stylesheet" type="text/css" href="prism.css"> 
     <script type="text/javascript" src="prism.js"></script> 
    </head> 
    <body> 
     <pre class=" language-css"> 
      <code class=" language-css"> 
       <span class="token selector">p</span> <span class="token punctuation">{</span> <span class="token property">color</span><span class="token punctuation">:</span> blue <span class="token punctuation">}</span> 
      </code> 
     </pre> 
    </body> 
</html>

我知道棱鏡增加language-css類到pre標記。但領先空間（" language-css"）從哪裏來？

來源

2016-12-09 mitchbrand

它可能只是做element.className += " language-css"因此，如果該元素上已經有一個類（如"foo"），它與foo language-css，而不是foolanguage-css結束。由於空間是無害的，在classList支持良好之前，這是相當常見的。

來源

2016-12-09 10:38:04

[這是（幾乎）完全正確]（https://github.com/PrismJS/prism/blob/b8ce1e7ccf38f867c3011255633e075d16799297/components/prism-core.js#L191） – lonesomeday

@lonesomeday：大聲笑很好！我打算打開「你必須看看棱鏡的來源，但是......」 –

爲什麼棱鏡語法高亮添加CSS類前面的空格？

回答

相關問題