How do i make this code non case sensitive?

Question

    function openPage() {
        var x = document.getElementById("search").value;

        if (x === "Science") {
            window.open("content/main/Science.html");
        }

        if (x === "Technology") {
            window.open("content/main/Technology.html");
        }
        
        if (x === "Engenieering") {
            window.open("content/main/Engineering.html");
        }
        
        if (x === "Arts") {
            window.open("content/main/Arts.html");
        }
        
        if (x === "Maths") {
            window.open("content/main/Maths.html");
        }
    }

Im really not into coding, this is a school proyect, and my teacher asked to make a searchbar, but he also asked to make any input no matter the spelling, so how can i do it?

Answer 1

When you make comparison make both sides lowercase so it will be non case sensitive, I also added .trim() on the value so extra space will not be a problem.

Cheers

function openPage() {
        var x = document.getElementById("search").value.trim().toLowerCase();

        if (x === "Science".toLowerCase()) {
            window.open("content/main/Science.html");
        }

        if (x === "Technology".toLowerCase()) {
            window.open("content/main/Technology.html");
        }
        
        if (x === "Engenieering".toLowerCase()) {
            window.open("content/main/Engineering.html");
        }
        
        if (x === "Arts".toLowerCase()) {
            window.open("content/main/Arts.html");
        }
        
        if (x === "Maths".toLowerCase()) {
            window.open("content/main/Maths.html");
        }
    }