Javascript: detect if browser is IE, then hide HTML

Question

I want to create a JavaScript function to hide the html if the visitor is using an IE browser. I did some research on Stackoverflow and the below is what I came up. It doesn't work. Can anyone tell me what I did wrong? Thanks!

HTML:

<div id="content">
  Hello
</div>

JS:

var isIE = /*@cc_on!@*/false || !!document.documentMode;


if (isIE === 'true') {
  function display() {
    document.getElementById('content').style.display="none";
  }
}

P.S. `display()` is never invoked. BTW look [here](https://stackoverflow.com/questions/19352522/how-can-i-detect-browser-type-using-jquery) — , Apr 30 '18 at 10:06
It's never really a good idea to detect what browser you are using, it's more flexible, and more future proof if you detect the features you require. — Keith, Apr 30 '18 at 10:12
Are you still looking for an answer, user1726263? You didn't respond to Jeroen Smink's answer? @Keith -- That's not always possible, at least not with little code. For example, how do you feature-detect whether a browser supports CSS hyphenation ('auto' value)? — Frank Conijn - Support Ukraine, Jun 19 '18 at 20:33
@FrankConijn Did you miss the part about feature detection, you of course feature detect for CSS,.. I'm sure I don't need to explain how to do that. :) — Keith, Jun 19 '18 at 21:18
@Keith -- You don't have to explain anything. Just give the code, so folks can see that it is possible with little code to feature-detect a certain CSS property and value combination. Or not, if you wanna keep ducking it. — Frank Conijn - Support Ukraine, Jun 19 '18 at 21:28
@FrankConijn `CSS && CSS.supports("hyphens", "auto");` Didn't think I needed to do that bit really.. But my original comment is what's important, browser user-agent sniffing is not a good idea, feature detection is more robust & more importantly more future proof. There might be some strange edge cases were user-agent sniffing might be the only way, but so far not something I've come across. `wanna keep ducking it` Not sure what that implies.. — Keith, Jun 19 '18 at 21:32
@Keith -- 'Ducking something` is slang for in this case avoiding a duty or responsibility. So far you haven't, but what makes you think that `CSS.supports` throws the said error and `CSS && CSS.supports` would not? (It does, too, of course.) — Frank Conijn - Support Ukraine, Jun 19 '18 at 22:51
@FrankConijn `window.CSS && CSS.supports("hyphens", "auto")` And of course you should have been able to figure that one out, unless you are of course deliberately ducking the issue. And still by no means invalidates what I have said from the start.. I'm really not sure what point your trying to make Frank... — Keith, Jun 19 '18 at 22:57
@Keith -- That solves the error, but it is by no means functional. `if (window.CSS && CSS.supports("display", "block")) alert('Support'); else alert('No support');` returns 'No support' in IE11. Not exactly a strange edge case, is it? — Frank Conijn - Support Ukraine, Jun 19 '18 at 23:06
@FrankConijn So your checking for a CSS property that exists in practically any current browser I can think of including IE11.. Yeah, not an edge case, just a pointless check. Please learn to feature detect, and then come back with your witty remarks.. thanks.. — Keith, Jun 19 '18 at 23:10
@Keith -- The quacking can now be heard loud and clear. LOL! — Frank Conijn - Support Ukraine, Jun 19 '18 at 23:19

score -1 · Answer 1 · answered Apr 30 '18 at 10:06

You could try this:

 <!DOCTYPE html>
    <html>
    <body>
    <p>What is the name(s) of your browser?</p>
    <button onclick="myFunction()">Try it</button>
    <p id="demo"></p>
    <script>

    function myFunction() { 
     if((navigator.userAgent.indexOf("Opera") || navigator.userAgent.indexOf('OPR')) != -1 ) 
    {
        alert('Opera');
    }
    else if(navigator.userAgent.indexOf("Chrome") != -1 )
    {
        alert('Chrome');
    }
    else if(navigator.userAgent.indexOf("Safari") != -1)
    {
        alert('Safari');
    }
    else if(navigator.userAgent.indexOf("Firefox") != -1 ) 
    {
         alert('Firefox');
    }
    else if((navigator.userAgent.indexOf("MSIE") != -1 ) || (!!document.documentMode == true )) //IF IE > 10
    {
      alert('IE'); 
    }  
    else 
    {
       alert('unknown');
    }
    }
    </script>

    </body>
    </html>

Javascript: detect if browser is IE, then hide HTML

1 Answers1