Question

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

而不是这个，我想在我的页面中显示或隐藏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>

Answer 1

如果没有使用条件IE评论的Javascript，你可以很容易地完成这个（IE vs.非IE）

<!--[if IE ]>
  <style>
    #chrome { display: none; }
  </style>

  <div id="ie">
    ie
  </div>
<![endif]-->
<div id="chrome">
  chrome
</div>

注意这仅适用于IE9及以下版本 - 如果您在IE10或更高版本中使用标准或怪异模式，则条件注释将无效。 Read more here

Answer 2

如果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';
}

Why is it considered a bad practice to omit curly braces?

Answer 3

使用{} / if语句时，您应该使用else。当只有一个语句时，可选，当有多个语句时，强制。高度建议始终使用{}，无论语句数量多少。

您还需要将字符串传递给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>

Answer 4

似乎是语法错误

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';
   }

Answer 5

我已经取得了巨大的成功，并使用this Stack Overflow检测Chrome的以下代码片段：

我已经过测试，它适用于Internet Explorer。

它避免使用我更喜欢的.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);
}

IE浏览器隐藏/显示元素 - Javascript

5 个答案: