- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
您好,我正在尝试将 highlight.js 与 Ajax 调用一起使用:它从 PHP 中提取数据脚本。 code
元素被填充,但它只设置背景和字体颜色的样式(在开发工具中验证),不会出现语法突出显示。我已经在我的 PHP 脚本中用 htmlspecialchars
清除了文件。通过直接在元素中键入代码,我确实获得了正确的行为。我的 HTML 代码:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>hljs & PHP Proxy</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/atelier-forest-dark.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
</head>
<body>
<pre>
<code id="code" class="xml"></code>
</pre>
<script type="text/javascript" src="js/mjs-0000B.js"></script>
</body>
</html>
我的Javascript:
var xhr = new XMLHttpRequest()
var target = document.getElementById('code')
xhr.onload = function(){
if(xhr.status === 200)
target.textContent = xhr.responseText
console.log("Ajax request completed")
}
xhr.open('GET','https://localhost/proxy.php',true)
xhr.send(null)
window.addEventListener("load", function(event) {
console.log("Window resources loaded");
window.setTimeout(function(){
hljs.highlightBlock(target)
}, 50)
});
和 PHP:这是废话,但我可以让它与 CORS 一起工作的唯一方法......:
<?php
$ch = curl_init();
// set url
curl_setopt($ch, CURLOPT_URL, "localhost/hljs-test.html");
//return the transfer as a string
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, false);
// $output contains the output string
$output = curl_exec($ch);
// close curl resource to free up system resources
curl_close($ch);
echo htmlspecialchars($output);
?>
我已经解决了这里几乎所有的问题,但还没有找到解决方案。到目前为止,HTML 和 JSON 数据都导致相同的行为 - 我很困惑。谢谢。
编辑:
这是 target.textContent 请求的输出:
<!doctype html> <html lang="en"> <header> <meta charset="utf-8"> <script src="js/0008.js"></script> </header> <body></body> </html>
最佳答案
htmlspecialchars($output);
转换 <
, >
和其他符号到 html entities
这就是荧光笔无法识别您的代码的原因。你必须 echo $output;
相反。
您正在调用 hljs.highlightBlock(target)
在错误的地方。
在xhr.onload
中调用它, 不在 window.onload
:
var xhr = new XMLHttpRequest()
var target = document.getElementById('code')
xhr.onload = function(){
if(xhr.status === 200) {
console.log("Ajax request completed")
target.textContent = xhr.responseText
hljs.highlightBlock(target)
}
}
xhr.open('GET','https://localhost/proxy.php',true)
xhr.send(null)
// REMOVE THE FOLLOWING:
window.addEventListener("load", function(event) {
console.log("Window resources loaded");
window.setTimeout(function(){
hljs.highlightBlock(target)
}, 50)
});
关于javascript - HighlightJS 出现的部分 CSS 样式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51031335/
我正在尝试用 AngularJS 编写 Markdown 编辑器。我正在使用 Angular Markdown (AngularJS Showdown 包装器)来解析 Markdown ,我想使用 h
你如何使用 npm Marked与 HighlightJS ?我正在尝试自动化我的文档以进行解析和样式化。从标记的文档中查看以下示例: // Using async version of marked
您好,我正在尝试将 highlight.js 与 Ajax 调用一起使用:它从 PHP 中提取数据脚本。 code 元素被填充,但它只设置背景和字体颜色的样式(在开发工具中验证),不会出现语法突出显示
我如何放置我的 HTML 代码以便 highlight.js 美化它? 我试过了 haha 我
给定数据是一些主要的 HTML 页面和模块的提供者 providers: [ { provide: HIGHLIGHT_OPTIONS, useValue
例如,诸如 retail-sample.xls 之类的文件名将单词 sample highlihgted 作为关键字。 有什么方法可以配置吗? 最佳答案 我不确定这是否适合您,但是,Highlight
使用 Remarkable 突出显示 HTML 代码时,我无法执行 highlight 函数。我取自示例 here : var md = new Remarkable({ html:true,
我是一名优秀的程序员,十分优秀!