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

Integrate PayPal® Payments

Web Form Software for Windows PC

Learn more   Trial version available!

check Build order forms for your website

check Easy to use - No programming required

check No shopping cart system required

 

 

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".

Disclaimer: The information, code snippets and samples on this page are provided "as is" without warranty of any kind. Further, Arclab Software OHG does not warrant, guarantee, or make any representations regarding the use, or the results of use, in terms of correctness, accuracy, reliability, currentness, or otherwise.