Changing the href of a link tag using JavaScript

Question

I am trying to change the href of a link tag so that when a button is pressed a new style sheet is loaded.

function addcss() {
var findlink = document.getElementsByTagName("link"); findlink.href = "stylesheetxhtml.css"; }

Answer 1

You can't set the href directly like that, because document.getElementsByTagName returns all the <link> tags (as a NodeList). If you're positive you only have one, use this:

var findlink = document.getElementsByTagName("link");
findlink[0].href = "stylesheetxhtml.css";

If you have multiple <link> elements and want to target a specific one, give it an id and use document.getElementById:

var findlink = document.getElementsById("myLinkId");
findlink.href = "stylesheetxhtml.css";

Finally, if you want to create a new <link> element, use document.createElement:

var newLink = document.createElement('link');
newLink.href = "stylesheetxhtml.css";
document.getElementsByTagName("head")[0].appendChild(newlink);