Javascript 为什么Prism syntax highlighter在CSS类前面添加一个空格？_Javascript_Html_Css

Javascript 为什么Prism syntax highlighter在CSS类前面添加一个空格？

javascript html css

Javascript 为什么Prism syntax highlighter在CSS类前面添加一个空格？,javascript,html,css,Javascript,Html,Css,我正在使用来自的Prism语法荧光灯如果我做了类似的事情 <!DOCTYPE html> <html> <head> <link rel="stylesheet" type="text/css" href="prism.css"> <script type="text/javascript" src="prism.js"></script> </head>

我正在使用来自的Prism语法荧光灯

如果我做了类似的事情

<!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>



p{颜色：蓝色}

我在Chrome开发工具中看到以下结果：



p{颜色：蓝色}

我知道Prism将

语言css

类添加到

pre

标记中。但是前导空间（

“language css”

）是从哪里来的呢？

它可能只是

element.className+=“language css”

，因此如果元素上已经有一个类（比如

“foo”

），那么它最终会得到

foo language css

，而不是

愚蠢的语言css

。由于空间是无害的，所以在

类列表

支持良好之前这是相当普遍的。

它可能只是

element.className+=“language css”

，因此如果元素上已经有一个类（比如

“foo”

），那么它最终会得到

foo language css

，而不是

愚蠢的语言css

。因为这个空间是无害的，所以在

classList

支持很好之前这是相当普遍的。

@lonesomeday:LOL很好的一个！我本打算以“你必须看棱镜光源，但是……”开头。lonesomeday:哈哈，不错！我打算以“你得看看棱镜光源，但是……”开头

<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>