Question

我要做的是检查是否存在类。如果存在，请按“X＆＃39; px在另一个班级，如果没有增加高度＆＃39; Y＆＃39; PX

不使用Jquery。它应该在IE8中得到支持。 IE8不支持document.getElementsByClassName，因此使用了className.match但后来又开始变长。我的下面的代码没有超过第3个

任何一个拥有短IE8友好代码的人？

window.onload = window.onresize = function heightResize () {
var browserHeight = window.innerHeight;
var present=document.getElementsByTagName('p');
alert(present.length);
 for (var i=0; i<present.length; i++) {
  if (present[i].className.match(/\bbuttons-container\b/))
       {
 alert("Yes Present");
 document.getElementsByClassName("boxcontent")[0].style.height = browserHeight -150 + "px";
       } else {
alert("Not Present");
document.getElementsByClassName("boxcontent")[0].style.height = browserHeight -200 + "px";
              }

              }

              };

HTML

 <p>
First Para
 </p>
  <table>
  <tr>
  <td>
    <p>
Second Paragraph
    </p>
    <div  id ="overlay_modal" class="boxcontent">
      Output
    </div>
     </td>
   </tr>
   </table>

  <p>
Third Para
  </p>
   <p class="buttons-container">
Buttons
   </p>

Answer 1

使用你的代码，我可以制作它的这个版本：

function getElementsByTagClassName(tag, className) {
  var ret = [], tags = document.getElementsByTagName(tag), i, len, item;
  for (i = 0, len = tags.length; i < len; i++) {
    item = tags[i];
    if (item.className.match("\\b" + className)) {
      ret.push(item);
    }
  }
  return ret;
}

function heightResize() {
  var browserHeight = parseInt(window.innerHeight || document.documentElement.clientHeight), 
      paragraphs, found = false, boxcontent, i, len, elem;

  paragraphs = getElementsByTagClassName('p', 'buttons-container');
  found = paragraphs && paragraphs.length;
  boxcontent = getElementsByTagClassName('div', 'boxcontent');
  if (boxcontent && boxcontent.length) {
    for (i = 0, len = boxcontent.length; i < len; i++) {
      elem = boxcontent[i];
      if (found) {
          elem.style.height = (browserHeight - 150 > 0 ? browserHeight - 150 : 0) + 'px';
      } else {
          elem.style.height = (browserHeight - 200 > 0 ? browserHeight - 200 : 0) + 'px';
      }
      alert(elem.style.height);
    }
  }
}

window.onload = window.onresize = heightResize;

您可以找到jsfiddle here和embedded version（在IE8中进行测试）

Answer 2

IE8确实不支持document.getElementsByClassName但支持querySelectorAll，尽管只支持IE8有限的CSS支持。

这允许您获取具有给定类的元素，如

document.querySelectorAll('.classname');

如果你真的需要选择“没有”类的元素（而不是给它们一个不同的类），你可以选择所有<p>标签，然后用类选择所有标签，看看哪些匹配。

请记住，querySelectorAll返回NodeList，而不是Array。它看起来像一个数组（并且可以循环）但它没有Array方法。

检查是否存在类，否则为div添加高度

2 个答案: