How to have javascript modify css link based on page name?

Question

I want the below javascript to update the specific css link bootstrap.min.js if the page is named mypage.html.
How would I do that?

<html>
  <head>

  <link rel="stylesheet" type="text/css" href="/css/bootstrap377.min.css"/>
  <link rel="stylesheet" type="text/css" href="/css/some_other_stylesheet.css"/>

  <script type="text/javascript">
    var filename = location.href.split("/").slice(-1); 

    if (filename == "mypage.html") {
      HOW DO I DO THIS:  update the above stylesheet link to be bootstrap400.min.css (or should this script be before the css link?)
    }
  </script>


  </head>
  <body>
    this is a test
  </body>
</html>

My example already accesses the filename, I need the script to modify the css link — Sarta
– Sarta, Commented Feb 3, 2017 at 17:23

GOTO 0 · Accepted Answer · 2017-02-03 18:58:28Z

1

Use document.querySelector to get a reference to the link element, then change the href property the usual way.

var filename = location.href.split("/").slice(-1); 

if (filename == "mypage.html") {
  var link = document.querySelector("link[href='/css/bootstrap377.min.css']");
  link.href = "/css/bootstrap400.min.css";
}

edited Feb 3, 2017 at 18:58

answered Feb 3, 2017 at 17:32

GOTO 0

48.8k25 gold badges139 silver badges165 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Sarta Over a year ago

Excellent! However I should have mentioned that my real world application has multiple css links so the only link to be updated is the link that contains "bootstrap.min.css". How would I do that?

GOTO 0 Over a year ago

@user3302169 I updated my solution. You may want to edit your question with the information that there are multiple links.

Collectives™ on Stack Overflow

How to have javascript modify css link based on page name?

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related