我想用highlight.js定义我自己的语言,但我想知道如何做到这一点。我找到了这本指南
使用下面的示例进行Language definition guide。有人知道我应该把这个配置放在哪里,这样highlight.js才能使用这个配置吗?
{
case_insensitive: true, // language is case-insensitive
keywords: 'for if while',
contains: [
{
className: 'string',
begin: '"', end: '"'
},
hljs.COMMENT(
'/\\*', // begin
'\\*/', // end
{
contains: [
{
className: 'doc', begin: '@\\w+'
}
]
}
)
]
}发布于 2021-03-09 17:37:42
您可以简单地使用class属性在highlightjs中指定语言。
例如,如果要突出显示python代码
<pre class="python">
<code>
print "Hello"
</code>
</pre>编辑:
创建一个名为highlightcon.min.js的文件,将其与html文件<script src="highlightcon.min.js"></script>链接起来,并将配置的对象粘贴到highlightcon.min.js中
如果你想定义你自己的语言,使用实时语法高亮显示,你可以使用ace编辑器,因为高亮显示js没有给出你正在寻找的特性……
在您的index.html使用中
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Editor</title>
<link rel="stylesheet" href="views/style.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.4.12/ace.js"></script>
</head>
<body>
<!-- Elements -->
<div id='container'>
<div id="editor">
</div>
<iframe id='iframe' frameBorder="0">
</iframe>
</div>
<!-- Javascript -->
<script src="script.js"></script>
</body>
</html><script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.4.12/ace.js">是王牌编辑cdn...
然后在您的script.js文件中
function update()
{
var idoc = document.getElementById('iframe').contentWindow.document;
idoc.open();
idoc.write(editor.getValue());
idoc.close();
}
function setupEditor()
{
window.editor = ace.edit("editor");
editor.setTheme("ace/theme/monokai");
editor.getSession().setMode("ace/mode/python");
editor.getSession().on('change', function() {
update();
});
editor.focus();
editor.setOptions({
fontSize: "16pt",
showLineNumbers: true,
showGutter: false,
vScrollBarAlwaysVisible:true,
enableBasicAutocompletion: true, enableLiveAutocompletion: true
});
editor.setShowPrintMargin(false);
editor.setBehavioursEnabled(true);
}
setupEditor();
update();
const elementToObserve = document.querySelector("#editor");在这里,您可以在下面的script.js中定义语言editor.getSession().setMode("ace/mode/python");。
您可以使用editor.session.setMode("ace/mode/" + language),只需在编写此命令之前指定如下语言即可
var language = "python"
这也提供了实时的语法突出显示。
https://stackoverflow.com/questions/66544020
复制相似问题