editor de codigo em html, css e javascript

04/01/2021

0

Olá tudo bom?
Bom estou tentando criar um editor de codigo em html, css e javascript.
Como o Rust (https://play.rust-lang.org/) ou o repl.it, o problema é a parte de aplicar um estilo nas palavra.
Vi uma maneira de fazer isso usando uma div com um atributo
<div contenteditable="true"></div>

e usando a seguinte função javascript
editor.addEventListener("keyup", () => {
    let ctn = editor.innerHTML

    for (let s of sintaxe) {
        ctn = ctn.replace(s.palavra+" ", `<span class="${s.classe}">${s.palavra}</span> `)
    }

    editor.innerHTML = ctn
    placeCaretAtEnd(editor)
})


porem nao funciona direito, pois tem ainda uma função que posiciona o cursor no fim da linha a todo momento.
Alguem poderia me ajudar com video, artigos e etc. Para que possa aplicar cor nas palavras chave e entre outros?
Edinho

Edinho

Responder

Que tal ter acesso a um e-book gratuito que vai te ajudar muito nesse momento decisivo?

Ver ebook

Recomendado pra quem ainda não iniciou o estudos.

Eu quero
Ver ebook

Recomendado para quem está passando por dificuldades nessa etapa inicial

Eu quero

Utilizamos cookies para fornecer uma melhor experiência para nossos usuários, consulte nossa política de privacidade.

Aceitar