Tibco is removing JQuery from Spotfire and I have some Dashboards relying on Jquery to work, as shown bellow:
var css = "https://localhost/css/style.css";
if (!$('link[href="' + css +'"]').length) {
$("<link/>", { "rel": "stylesheet", "type": "text/css", "href": css }).appendTo("head");
}
I would like to do the same using Javascript, but I was unable to find a solution that allow me to load the CSS only if does not exist in DOM.
Whatever selector that works in jQuery will work with document.querySelector method.
Something like this:
if (!document.querySelector(`link[href='${css}']`)) {
document.head.innerHTML += `<link rel="stylesheet" href="${css}" type="text/css"/>`;
}
const cssHref = "https://localhost/css/style.css";
// If element not found returns `null`
const stylesheet = document.querySelector(`link[href="${cssHref}"]`)
if (!stylesheet) {
// You can create your own helper function to simplify the creation of the element
// instead of manually creating the <link> element
const style = document.createElement('link')
style.rel = 'stylesheet'
style.href = cssHref
document.head.append(style)
}