Javascript 带html代码的highlightjs
如何放置HTML代码以便highlight.js美化它 我试过了Javascript 带html代码的highlightjs,javascript,html,syntax-highlighting,prettify,Javascript,Html,Syntax Highlighting,Prettify,如何放置HTML代码以便highlight.js美化它 我试过了 <pre> <code> <!-- HTML Prettify --> <div> <pre class="pre-code-ception"><code> haha </code></pre> </div> </code>
<pre>
<code>
<!-- HTML Prettify -->
<div>
<pre class="pre-code-ception"><code> haha </code></pre>
</div>
</code>
</pre>
<?php
$code = <<< EOT
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<img src="image.png" />
</body>
</html>
EOT;
?>
<pre>
<code class="html">
<?php echo htmlspecialchars( $code ); ?>
</code>
</pre>
hljs.initHighlightingOnLoad（）；
但是所有内容都显示为纯HTML。哦，我想我理解这个问题。您需要在
元素中转义HTML，否则它将被解释为HTML而不是文本（您希望HTML按字面显示，而不是解释为网页结构的一部分）
将每个
改为
，以及代码示例中的任何其他特殊HTML字符。（如果您正在动态生成页面，大多数语言都有一个实用功能来为您转义HTML。）要添加到@Cameron关于转义HTML的答案中：
如果要突出显示大量代码，并且不想手动转义所有内容，一个选项是使用语法将其保存为变量，并使用htmlspecialchars（）
（PHP）的变体转义。Heredoc允许您将多行字符串保存为变量，而无需使用串联运算符
然后只需在
块中回送它
document.querySelectorAll("code").forEach(function(element) {
element.innerHTML = element.innerHTML.replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">").replace(/"/g, """).replace(/'/g, "'");
});
使用此方法的好处是代码在文档中保持可读性
例子：
关于使用heredoc，需要注意的一点是，您的结束语
EOT$（'code'）。每个（函数（）{
var，该值=$（此值）；
//缓存“代码”的内容
var html=that.html（）.trim（）；
那。空（）；
//逃避内容
文本（html）；
});
hljs.initHighlightingOnLoad（）；
document.querySelectorAll（“code”）.forEach（函数（元素）{
element.innerHTML=element.innerHTML.replace（///g，“&；”）.replace（///g，”）.replace（///g，“&；”）.replace（///g，”&；”）；
});
HLJS.configure（{'languages'：['html']}）手动设置它在初始化行之前。不幸的是，这会打断新行。这很好。但是，不适用于…
…
…
etc标记。有没有解决办法？谢谢，谢谢！这节省了我很多时间。这很好。但是，不适用于…
…
…
etc标记。有没有解决办法？谢谢。免责声明：我是Highlight.js的当前维护者。这只是要求HTML或JS注入式攻击的安全问题。请不要这样做。代码需要在服务器上转义-在它到达客户端之前，而不是之后。
document.querySelectorAll("code").forEach(function(element) {
element.innerHTML = element.innerHTML.replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">").replace(/"/g, """).replace(/'/g, "'");
});