Question

我在我的网站上使用ACE编辑器。我需要在编辑器中选择/突出显示某一行。但是当它是一个大型代码时，ACE编辑器会显示一些错误，例如，当它向下滚动行号更改并且突出显示行号与我想要突出显示的那个不同时。我搜索过并找到了这个Problem.但实际上我无法理解它。任何人都可以举一些例子来突出ACE编辑器中的一行吗？这是我目前的代码：

var aceLines = document.getElementsByClassName("ace_line");
var gutters = document.getElementsByClassName("ace_gutter-cell");
var gutLineNo = parseInt(gutters[0].innerHTML)-1;

if(count1 != 0){
        aceLines[arNum[count]-gutLineNo].style.backgroundColor = "green";
        aceLines[arNum[count1]-gutLineNo].style.backgroundColor = "black";

    }else{
        aceLines[arNum[count]-gutLineNo].style.backgroundColor = "green";
    }

Answer 1

请勿尝试直接修改编辑器dom。 Ace仅为可见线创建dom节点您需要像How can I highlight multiple lines with Ace?

中所述使用setMarker

首先创建一个设置背景的css类

.myMarker {
  position:absolute;
  background:rgba(100,200,100,0.5);
  z-index:20
}

然后添加标记

var Range = ace.require('ace/range').Range;
editor.session.addMarker(new Range(from, 0, to, 1), "myMarker", "fullLine");

此处from和to是您想要突出显示的行数

如何突出ACE编辑器中的某一行？

1 个答案: