While it’s not exactly what you’re asking, you can achieve the same effect in 99% of cases by using an action to append the script or style in the header.
Here it goes:
To load an external CSS
loadCSS = function(href) {
var cssLink = $("<link>");
$("head").append(cssLink); //IE hack: append before setting href
cssLink.attr({
rel: "stylesheet",
type: "text/css",
href: href
});
};
loadCSS("https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.1.2/styles/default.min.css");
Now for loading external scripts
var script = document.createElement('script');
script.onload = function () {
// do whatever you want now that the external script is loaded
};
script.src = "https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.1.2/highlight.min.js";
document.head.appendChild(script);
Now to apply to the page a style you’re creating right now:
var sheet = document.createElement('style');
sheet.innerHTML =
`.selector {
color: ${properties.icon_color};
font-size: ${properties.icon_size}px;
}`;
document.head.appendChild(sheet);