0

我有以下 javascript（在 blogspot 博客中调整图像大小）：

  var imageTags = document.getElementsByTagName('img');
  for(i = 0 ; i < imageTags.length; i++){
    if( imageTags[i].src.indexOf('/s400/', 0)>-1 ) {
      if(imageTags[i].style.width=='400px' || imageTags[i].width==400) {
      imageTags[i].style.width='556px';
        imageTags[i].style.height='368px';
      } else {
        imageTags[i].style.width='368px';
        imageTags[i].style.height='556px';
      }
      imageTags[i].src=imageTags[i].src.replace('/s400/', '/s556/');

    }
  }

它在 Firefox 和 Chrome 上完美运行，但在 IE（经过测试的 IE9）上，它似乎总是进入第二个分支，好像imageTags[i].width==400总是被评估为 false。如何修复 IE 浏览器？

编辑：正如建议的那样，我暂时添加了一个警报来显示图像的宽度，而在 IE9 上它是.... 416。看起来 IE 为 html 的宽度添加了边距。

4

3 回答 3

0

请运行它并告诉你得到什么 - 目前你调整大小然后加载新图像

var imageTags = document.getElementsByTagName('img');
for(var i=0,n=imageTags.length,img,src,w,h,newImg; i<n; i++) {
  img =  imageTags[i];
  src = img.src;
  if(src.indexOf('/s400/', 0)==-1 ) continue;
  alert(img.width);
  if(img.width==400) {
    w=556;
    h=368;
  } else {
    w=368;
    h=556;
  }
  newImg = document.createElement("img");
  newImg.onload=function() { this.width=w; this.height=h}
  newImg.src=src.replace('/s400/', '/s556/')
  img.parentNode.replaceChild(newImg,img);
}
于 2012-05-10T20:55:22.663 回答
0

尝试imageTags[i].offsetWidth==400而不是imageTags[i].width==400
我建议它，因为 .width 属性仅获取width标签中定义的内容，而.offsetWidth获取实际宽度

于 2012-05-10T20:36:53.867 回答
0

正如建议的那样，我检查了 IE 报告的宽度是 416 而不是 400（可能添加了边距？）。所以我只是添加了一个明显的 hack 来检查 400 和 416。

于 2012-05-11T07:06:17.027 回答