JavaScript IF Statement to change Link classes

Question

I have some JS that currently gets the URL of a website, splits the URL to a particular string and stores it in a variable

I then have an IF statement that depending on that string will add a class to my links. However, the i can't get the IF statement to work. It seems to do the action even if the condition has been met.

Any help would be greatly appreciated!

https://codepen.io/Carrot654321/pen/YazXBv - Code here

   const navLinks = document.querySelectorAll("nav ul li a")
   var url = window.location.href;

    url = url.split("/");



    if (url[2] = "s.codepen.io") {
     navLinks[1].classList.add("active");

     } 
    else {
    navLinks[3].classList.add("active"); 

     }

= is for assignment, == is for comparison. Replace = with == in your if condition and see what happens — Lelio Faieta, Mar 08 '18 at 17:19
To the people downvoting, this is a genuine question and an easy mistake to make. — Steve, Mar 08 '18 at 17:24

score 4 · Accepted Answer · answered Mar 08 '18 at 17:22

4

   const navLinks = document.querySelectorAll("nav ul li a")
   var url = window.location.href;

    url = url.split("/");



    if (url[2] === "s.codepen.io") {
     navLinks[1].classList.add("active");

     } 
    else {
    navLinks[3].classList.add("active"); 

     }

use === instead of = and don't use == as you will experience weird behavior because == does type conversion before comparison.

have a look at this - https://stackoverflow.com/questions/359494/which-equals-operator-vs-should-be-used-in-javascript-comparisons

answered Mar 08 '18 at 17:22

Saikat Hajra

670
3
12

Thank you! This worked perfectly, quite new to this so still making some silly mistakes – Nick Mar 09 '18 at 09:49
happy coding @Nick – Saikat Hajra Mar 09 '18 at 10:09

score 1 · Answer 2 · answered Mar 08 '18 at 17:21

1

I suspect this is because you have a single equals instead of a triple equals.

    if (url[2] = "s.codepen.io")

This is assigning a value instead of comparing on it so it always returns true.

It should be:

    if (url[2] === "s.codepen.io")

answered Mar 08 '18 at 17:21

Gordon Quinn

132
6

JavaScript IF Statement to change Link classes

2 Answers2