Как мне сделать так, чтобы текстовая область html отображалась на javascript?

#javascript #html

#javascript #HTML

Вопрос:

В принципе — я хочу a <textarea> , но когда люди вводят в нее что-то, например — const item = require('item') , я хочу const , чтобы оно отображалось фиолетовым, как редакторы JavaScript.

Комментарии:

1. это невозможно со стандартной текстовой областью.

2. Вам нужно будет использовать что-то вроде highlightjs.org . стандартная текстовая область не может справиться с этим.

3. Может быть, взгляните на Vue.js ? Если я правильно понял ваш вопрос, вы хотите выделить некоторый текст в режиме «live»? Vue.js возможно, это поможет вам в этом — это самый простой способ, который я могу придумать прямо сейчас. Или используйте уже созданные библиотеки JS, например prims.js или highlight.js

Ответ №1:

Для этого вам нужна библиотека редактора кода JS, поскольку это невозможно с обычной текстовой областью и некоторыми JS. (И highlight.js как предложил Ritesh, не будет работать, потому что он не предназначен для ввода в реальном времени), так что вот несколько хороших библиотек, которые вы можете использовать для подсветки синтаксиса в реальном времени:

Редакторы с множеством отличных функций:

CodeMirror

Туз

Некоторые меньшие:

CodeJar

CodeFlask

И абсолютный перебор:

Монако

Надеюсь, я мог бы вам помочь. Хорошего дня 🙂

Комментарии:

1. это невозможно с обычной текстовой областью, да, это так. Возможно, OP придется написать какой-то реальный код, но вам не обязательно использовать стороннюю библиотеку

2. @Liam Да, вроде того… Наиболее часто используемый способ сделать это — сделать фактическую текстовую область невидимой, и вы используете текст из нее для генерации html-кода для выделения текста точно за ним. Я просто имел в виду, что вам нужно больше, чем текстовое поле — извините, если это было непонятно.