У мене була проблема з InternalHTML, мені довелося додати скрипт Hotjar до тегу "head" мого додатку Reactjs, і він повинен був би виконатись відразу після додавання.
Одне з хороших рішень для динамічного імпорту Вузла в тег "head" - це модуль React-helment .
Також є корисне рішення для запропонованого питання:
У InternalHTML немає тегів сценаріїв!
Виявляється, HTML5 не дозволяє теги сценарію динамічно додаватись за допомогою властивості innerHTML. Отже, наступне не буде виконано, і не буде оповіщення про привіт World!
element.innerHTML = "<script>alert('Hello World!')</script>";
Це задокументовано у специфікації HTML5:
Примітка: елементи сценарію, вставлені за допомогою InternalHTML, не виконуються, коли вони вставлені.
Але будьте обережні, це не означає, що InternalHTML є безпечним від перехресних сценаріїв. Можна виконувати JavaScript через innerHTML без використання тегів, як показано на внутрішній сторінці MDHTML MDN .
Рішення: Динамічне додавання сценаріїв
Щоб динамічно додати тег скрипту, потрібно створити новий елемент сценарію та додати його до цільового елемента.
Це можна зробити для зовнішніх сценаріїв:
var newScript = document.createElement("script");
newScript.src = "http://www.example.com/my-script.js";
target.appendChild(newScript);
І вбудовані сценарії:
var newScript = document.createElement("script");
var inlineScript = document.createTextNode("alert('Hello World!');");
newScript.appendChild(inlineScript);
target.appendChild(newScript);