Рубрики
Без рубрики

Как я создал в памяти DOM?

IMG Credits Введение несколько недель назад, у меня была задача создать онлайн -редактор кода … Tagged with React, JavaScript, WebDev, HTML.

IMG Кредиты

Введение

Несколько недель назад у меня была задача создать онлайн -редактор кода для HTML, CSS, JS, и показать вывод на том же экране.

Зачем мне нужен в памяти Дом?

Я хранил разные коды в разных переменных, и для того, чтобы показать вывод на одном экране, мне пришлось создать виртуальный DOM и объединить все коды (HTML + CSS + JS) вместе и внедрить его в IFRAME.

Код

Приведенный выше код принимает HTML, CSS и JavaScript в качестве строки, а затем объединяет их вместе в HTML. Он возвращает объединенный код в качестве строки, а затем вводится в iframe.

Демо

Вы можете увидеть работу приведенного выше кода в этом приложении. Редактор веб -кода

Редактировать 1. Изменил заголовок с VDOM на DOM в памяти, когда я принял его за VDOM. Спасибо @lukeshiru для предложения.

IMG кредиты

  1. Крелло
  2. Морио

Оригинал: “https://dev.to/abhishekraj272/how-i-created-this-mini-virtual-dom-13lp”