Insert Link (CSS) or Script into Header (Javascript)
How to insert a <link> (CSS file) or <script> (Javascript file) element into the HTML <head> section
Insert Element into HTML <head> Section
A <link href=...> or <script src=...> element can easily be inserted into the HTML head area of a web page with just a few Javascript instructions.
The procedure is the same in both cases: First create the corresponding element using "document.createElement" and then insert it into the HTML <head> section of the page using "document.getElementsByTagName("head")[0].appendChild".
Insert <link> Element into HTML <head> Section:
Javascript Sample for CSS Stylesheet:
var link=document.createElement("link");
link.type="text/css";
link.rel="stylesheet";
link.href="https://www.yourdomain.tld/styles/example.css";
document.getElementsByTagName("head")[0].appendChild(link);
Insert <script> Element into HTML <head> Section:
Javascript Sample:
var script=document.createElement("script");
// script.async=true;
script.src="https://www.yourdomain.tld/scripts/example.js";
document.getElementsByTagName("head")[0].appendChild(script);
If you want to load the script asynchronously, remove the comment ("//") from "script.async".