Estoy tratando de agregar el código de mi sitio web html desde data-prototype :
<div id="accordion" data-prototype=' <div class="card-body"> <textarea id="solution_answers___name___content" name="solution[answers][__name__][content]" required="required"></textarea> <script type="text/javascript"> var CKEDITOR_BASEPATH = "/bundles/fosckeditor/"; </script> <script type="text/javascript" src="/bundles/fosckeditor/ckeditor.js"></script> <script type="text/javascript"> if (CKEDITOR.instances["solution_answers___name___content"]) { CKEDITOR.instances["solution_answers___name___content"].destroy(true); delete CKEDITOR.instances["solution_answers___name___content"]; } </script> </div>'></div> Como puede ver, también hay código js de ckeditor.
Cuando trato de agregarlo con jquery :
let el = document.querySelector('#accordion'); let template = el.dataset.prototype; let $root = $(el); $root.append(template);Todo funciona bien, quiero decir que no hay errores en la consola.
Cuando trato de agregarlo con vanilla js:
let el = document.querySelector('#accordion'); let template = el.dataset.prototype; const scriptEl = document.createRange().createContextualFragment(template); el.append(scriptEl);En la consola de desarrollo, recibo un error:
Uncaught ReferenceError: CKEDITOR is not definedSi ejecuto el mismo script una vez más, el error desaparece y todo funciona como se esperaba.
¿Alguien sabe por qué me sale ese error?
Aquí está el contenido de /bundles/fosckeditor/ckeditor.js
Parece que el error no se trata de que intentes agregar este código html a tu sitio. Deberías definir CKEDITOR como una const let o var (no recomiendo la tercera) en lugar de usar OR y asignarlo al objeto de la ventana.
const CKEDITOR = //...