如何在IE6 - IE8中检查html元素是否在样式标签中设置了一些样式属性

How to check if html element has some style properties set in style tag in IE6 - IE8?

本文关键字:样式 设置 标签 属性 是否 html IE6 IE8 检查 元素      更新时间:2023-09-26

var bg_img = curr_elem.style.backgroundImage || curr_elem.style.getAttribute("background-image");

如果curr_elem<style>标签中设置了此属性,则返回null,而不是像这样:style = "background-image: url(blah.png);"在元素本身中。

那么,我怎么知道如果一些背景图像应用到这个元素的代码?

我们可以在IE9+中使用getComputedStyle,但我需要在IE6+中使用

<html>
    <head>
        <title>test clone elements</title>
        <style type ="text/css">
            #banner-map-225 .banner-map
            {
                background-image: url(test_bg.jpg);
            }
        </style>
    </head>
    <body>
        <div id = "banner-map-225" ></div>
        <div id = "inline_styled_div" style = "background-image: url(test_bg.jpg);" ></div>
        <input type = "button" value = "test first div" onclick = "alert(document.getElementById('banner-map-225').style.backgroundImage);" />
        <input type = "button" value = "test second div" onclick = "alert(document.getElementById('inline_styled_div').style.backgroundImage);" />
    </body>
</html>

有点做作,但应该可以…

  var theDiv = document.getElementById('banner-map-225');
  var styleArr = document.getElementsByTagName('STYLE');
  var startPos;
  var endPos;
  var textFromStyle;
  var theImageText;
  for (var i = 0; i < styleArr.length; i++) {
    // find the element selector
    if (styleArr[i].innerHTML.toUpperCase().indexOf(theDiv.id) === -1) {
      // use class name
      startPos = styleArr[i].innerHTML.toUpperCase().indexOf(theDiv.className.toUpperCase());
      if (startPos > -1) {
        startPos = startPos + theDiv.className.length;
      }
    } else {
      // use id
      startPos = styleArr[i].innerHTML.toUpperCase().indexOf(theDiv.id.toUpperCase());
      if (startPos > -1) {
        startPos = startPos + theDiv.id.length;
      }
    }
    if (startPos > -1) {
      // get everything after selector
      textFromStyle = styleArr[i].innerHTML.substring(startPos);
      // find the style def for the element
      startPos = textFromStyle.indexOf('{');
      endPos = textFromStyle.indexOf('}');
      if (startPos > -1) {
        textFromStyle = textFromStyle.substring(startPos, endPos + 1);
        // find bg image def
        startPos = textFromStyle.toUpperCase().indexOf('BACKGROUND-IMAGE');
        endPos = textFromStyle.indexOf(')');
        if (startPos > -1) {
          // get contents of url
          startPos = startPos + ('BACKGROUND-IMAGE').length;
          textFromStyle = textFromStyle.substring(startPos, endPos + 1);
          startPos = textFromStyle.toUpperCase().indexOf('URL(') + ('URL(').length;
          endPos = textFromStyle.indexOf(')');
          if (startPos > -1) {
            theImageText = trimString(textFromStyle.substring(startPos, endPos));
            break;
          }
        }
      }
    }
  }
  // here's your image
  if (theImageText) {
    alert(theImageText);
  }
  // no trim in early IE
  function trimString(sText) {
    return sText.replace(/^'s+|'s+$/g, '');
  }