下面是HTML代码。我正在尝试使用 ace js 创建编辑器
<!DOCTYPE html>
<html lang="en">
<head>
<script>
window.onload = function what() {
var a = document.getElementById("abc");
a.innerHTML = 'hi';
};
</script>
<title>ACE in Action</title>
<style type="text/css" media="screen">
#editor {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
</style>
</head>
<body>
<div id="editor">
<span id="abc">Class </span>{ public void add(int a, int b){ int sum=a+b; } }
</div>
<script src="http://ajaxorg.github.io/ace-builds/src/ace.js" type="text/javascript" charset="utf-8"></script>
<script src="http://ajaxorg.github.io/ace-builds/src/ext-language_tools.js"></script>
<script type="text/javascript" src="ClassData.json"></script>
<script>
var langTools = ace.require("ace/ext/language_tools");
var editor = ace.edit("editor");
editor.setTheme("ace/theme/monokai");
editor.session.setMode("ace/mode/java");
editor.setOptions({
enableBasicAutocompletion: true
// enableLiveAutocompletion: true
});
var staticWordCompleter = {
getCompletions: function(editor, session, pos, prefix, callback) {
var wordList = ["foo", "bar", "baz", "arpit", "abhishek"];
callback(null, wordList.map(function(word) {
return {
caption: word,
value: word,
meta: "class"
};
}));
}
}
langTools.addCompleter(staticWordCompleter);
</script>
</body>
</html>错误：
错误"无法设置空的属性'innerHTML'"。
我正在尝试使用 Ace JS 创建一个在线编辑器，该功能可在创建任何对象时自动导入包并添加类的自定义名称。为此，我在 Class 旁边添加了一个"p"标签，以便我可以在该行中插入一些文本，但它无法检测到名为"abc"的 id。
您正在使用的 ACE 编辑器似乎不接受文本字段中的 HTML。打开开发人员工具并检查内容显示 ACE 编辑器删除了 idabc的span，这就是为什么您得到一个空指针来尝试访问不存在的元素。
编辑器已修改文本的开头，使其在开发人员工具中查看时看起来像<span class="ace_support ace_function">Class</span>。