Question

我正在尝试通过在其中插入自己的Javascript文件来修改现有网页。我正在通过我的Javascript插入一个新的Div并将该div的背景设置为图像网址来为此网页设置背景图像。为了使这个图像在背景上居中并使其占据整个网页，我正在使用

'background-size': 'cover'

属性。这当然不适用于较旧的IE版本。

我想修复它，我想通过使用页面高度/宽度和图像高度/宽度计算的特定比率来放大图像。

所以我想检测浏览器是否是IE。我检查了网页，它有这个代码检测浏览器并添加一个类IE的div。

<!--[if lte IE 5]>
  <div class="ie">
<![endif]-->
<!--[if IE 6]>
  <div class="ie ie6">
<![endif]-->
<!--[if IE 7]>
  <div class="ie ie7">
<![endif]-->

我的问题是如何检测此页面是否有一个div类。此外，我真的很感激，如果有人可以建议在网页页面上设置背景图像的替代方法，无论图像/页面的尺寸如何，都可以完全占据背景图像。

Answer 1

您必须遍历页面上的所有<div>元素，直到一个元素与您要查找的className匹配。类似的东西：

var div = document.getElementsByTagName('div');
for(i=0; i<div.length; i++) {
    if(div[i].className.match(/(^|\s)ie(\s|$)/)) {

        // Code to Do your IE Stuff Here

        break;
    }
}

Answer 2

document.addEventListener("DOMContentLoaded", function() {
  var ie = document.getElementsByClassName("ie");
  if(ie.length > 0) {
    alert("It's IE!");
  }
}

这应该回答你的第一个问题，尽管我同意为你的总体目标提供更好的解决方案。

Answer 3

如果您在页面中加载jQuery库，可以从Google CDN链接，这是一件非常简单的事情。

CDN：https://developers.google.com/speed/libraries/devguide#jquery

使用方法： $（ “div.className”）。第一（）

否则这将需要更多努力...处理这个问题的最佳方法是在div元素中添加一个id属性，如下所示：

<div id="myElement"></div>

然后使用document.getElementById函数检索div标签。

document.getElementById('myElement');

要在此添加后查看是否有特定类，请参阅此其他帖子： Test if an element contains a class?

检查页面中是否存在具有特定类的Div

3 个答案: