Создайте новый элемент с перезагрузкой скрипта JS

Question

Я пытаюсь реализовать блокнот jupyter на моем flask веб-сайте с https://github.com/minrk/thebelab.

У меня есть кнопка, которая должна создать новую ячейку.

<code><script type="text/javascript" src="https://unpkg.com/thebelab@latest"></script>


        <div id="cells">
            <pre id="cell" data-executable="true" data-language="python">

Новая ячейка function newCell () {var pre_cell = document.createElement ("pre"); var attr_id = document.createAttribute ("id"); attr_id.value = "cell"; pre_cell.setAttributeNode (attr_id); var attr_data_executable = document.createAttribute ("исполняемый файл"); attr_data_executable.value = "true"; pre_cell.setAttributeNode (attr_data_executable); var attr_data_language = document.createAttribute ("язык данных"); attr_data_language.value = "python"; pre_cell.setAttributeNode (attr_data_language); var element = document.getElementById ("ячейки"); element.appendChild (pre_cell); }

Цель состоит в том, чтобы создать новый

<code> <pre id="cell" data-executable="true" data-language="python">

в cells div

Но я думаю, Мне нужно перезагрузить страницу, чтобы увидеть ячейки. Предварительные теги добавляются на страницу, но без функции ячейки jupyter. Это только пустой предварительный тег.

Как это можно решить?