如果IE - Javascript隐藏/显示元素

Hide/Show element if IE - Javascript

本文关键字：显示 元素 隐藏 Javascript IE 如果      更新时间：2023-09-26

我正在使用一个脚本，弹出一个alert，如果用户是或不是使用IE。

相反，我想在我的页面中显示或隐藏div元素。

我已经尝试失败了:http://fiddle.jshell.net/shhv1Lx3/2/

工作警报演示在这里: http://fiddle.jshell.net/shhv1Lx3/3/

function GetIEVersion() {
  var sAgent = window.navigator.userAgent;
  var Idx = sAgent.indexOf("MSIE");
  // If IE, return version number.
  if (Idx > 0) 
    return parseInt(sAgent.substring(Idx+ 5, sAgent.indexOf(".", Idx)));
  // If IE 11 then look for Updated user agent string.
  else if (!!navigator.userAgent.match(/Trident'/7'./)) 
    return 11;
  else
    return 0; //It is not IE
}
var e = document.getElementById(ie);
var e2 = document.getElementById(chrome);
if (GetIEVersion() > 0) 
   alert("This is IE " + GetIEVersion());
   e.style.display = 'block';
   e2.style.display = 'none';
else 
   alert("This is not IE.");
   e.style.display = 'none';
   e2.style.display = 'block';
<div id="ie">
ie
</div>
<div id="chrome">
chrome
</div>

你可以很容易地完成这一点(IE或非IE)没有Javascript使用条件IE注释

<!--[if IE ]>
  <style>
    #chrome { display: none; }
  </style>
  <div id="ie">
    ie
  </div>
<![endif]-->
<div id="chrome">
  chrome
</div>

注意这只适用于IE9及以下版本-如果您在IE10或以上版本中使用标准或怪癖模式，条件注释将不起作用。点击这里阅读更多内容

使用if/else语句时应使用{}。当只有一条语句时是可选的，当有多条语句时是必选的。I 高度建议始终使用{}，无论语句的数量。

您还需要将字符串传递给getElementById()。

function GetIEVersion() {
  var sAgent = window.navigator.userAgent;
  var Idx = sAgent.indexOf("MSIE");
  // If IE, return version number.
  if (Idx > 0){
    return parseInt(sAgent.substring(Idx+ 5, sAgent.indexOf(".", Idx)));
  }
  // If IE 11 then look for Updated user agent string.
  else if (!!navigator.userAgent.match(/Trident'/7'./)){
    return 11;
  }
  else{
    return 0; //It is not IE
  }
}
var e = document.getElementById('ie');
var e2 = document.getElementById('chrome');
if (GetIEVersion() > 0){
   alert("This is IE " + GetIEVersion());
   e.style.display = 'block';
   e2.style.display = 'none';
}
else{
   alert("This is not IE.");
   e.style.display = 'none';
   e2.style.display = 'block';
}
<div id="ie">
ie
</div>
<div id="chrome">
chrome
</div>

当您在if或else中有多条语句时，您需要将它们用花括号括起来。

if (GetIEVersion() > 0) {
   alert("This is IE " + GetIEVersion());
   e.style.display = 'block';
   e2.style.display = 'none';
} else {
   alert("This is not IE.");
   e.style.display = 'none';
   e2.style.display = 'block';
}

为什么省略花括号被认为是不好的做法?

似乎是语法错误

if (GetIEVersion() > 0)  {
   alert("This is IE " + GetIEVersion());
   e.style.display = 'block';
   e2.style.display = 'none';
   }
else { 
   alert("This is not IE.");
   e.style.display = 'none';
   e2.style.display = 'block';
   }

我有巨大的成功与以下代码片段从这个堆栈溢出答案检测Chrome:

我已经测试过了，它在ie浏览器上运行得很好。

它避免了我喜欢的.indexOf()方法。您只需将正则表达式中的搜索参数替换为MSIE

var detectID = (function() {
  var ua = navigator.userAgent,
    tem,
    M = ua.match(/(opera|chrome|safari|firefox|msie|trident(?='/))'/?'s*('d+)/i) || [];
  if (/trident/i.test(M[1])) {
    tem = /'brv[ :]+('d+)/g.exec(ua) || [];
    return 'IE ' + (tem[1] || '');
  }
  if (M[1] === 'Chrome') {
    tem = ua.match(/'b(OPR|Edge)'/('d+)/);
    if (tem != null) return tem.slice(1).join(' ').replace('OPR', 'Opera');
  }
  M = M[2] ? [M[1], M[2]] : [navigator.appName, navigator.appVersion, '-?'];
  if ((tem = ua.match(/version'/('d+)/i)) != null) M.splice(1, 1, tem[1]);
  return M.join(' ');
})();
if (detectID.match("IE") || detectID.match("MSIE") ) {
  console.log("IE Browser Detected: " + detectID);
} else {
  console.log("Not IE: " + detectID);
}
相关文章：