JavaScript

Hey there StackOverflow Community!

I’m fairly new to Stack and coding in general so this code will probably have an obvious error that I can’t figure out.

Basically, in the following code I want everything shown on screen that isn’t the element with the id settings to be hidden.

if ((!"#settings").style.display === "block") {
        $(!"#settings").hide();
    }

JavaScript
​x
 
if ((!"#settings").style.display === "block") {
        $(!"#settings").hide();
    }
​

HTML:

<body>
    <span id="mainBtnArea">
        <button id="settings-btn">Settings</button>
        <button id="stats-btn">Stats</button>
    </span>
    <div id="mainArea">
        <h1 id="clickHeader"></h1>
        <button id="main-btn">Click Me</button>
    </div>
    <div id="settings">
        <h1>this is the page I want to show</h1>
    </div>
    <div id="stats">
        <p id="stats-clicks" class="stats">Keys:</p>
        <p id="stats-keys" class="stats">Keys:</p>
    </div>
</body>

JavaScript
 
<body>
    <span id="mainBtnArea">
        <button id="settings-btn">Settings</button>
        <button id="stats-btn">Stats</button>
    </span>
    <div id="mainArea">
        <h1 id="clickHeader"></h1>
        <button id="main-btn">Click Me</button>
    </div>
    <div id="settings">
        <h1>this is the page I want to show</h1>
    </div>
    <div id="stats">
        <p id="stats-clicks" class="stats">Keys:</p>
        <p id="stats-keys" class="stats">Keys:</p>
    </div>
</body>
​

Answer

    var elements = document.getElementsByTagName('div');
for (var i = 0; i < elements.length; i++) {
    if (elements[i].id != 'settings') {
        elements[i].style.display = 'none';
    }
}

JavaScript
 
    var elements = document.getElementsByTagName('div');
for (var i = 0; i < elements.length; i++) {
    if (elements[i].id != 'settings') {
        elements[i].style.display = 'none';
    }
}
​

You need to have a forloop! Update: You have to add an element tag DIV in order for it to work. Please see above.

It works for me: https://jsfiddle.net/bowtiekreative/j697okqd/1/

Javascript – Hide all elements that do not have the specified ID

Advertisement

Answer