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 と評価されるかのように、常に 2 番目のブランチに入るようです。IE ブラウザーで修正するにはどうすればよいですか?

編集: 提案されているように、画像の幅を表示するアラートを一時的に追加しましたが、IE9 では.... 416 でした。IE が html の幅にマージンを追加したようです。

4

3 に答える 3

0

示唆されたように、IE によって報告された幅を調べたところ、400 ではなく 416 でした (余白が追加された可能性があります)。そこで、400 と 416 の両方をチェックする明らかなハックを追加しました。

于 2012-05-11T07:06:17.027 に答える
0

.width プロパティはタグで定義されたものだけを取得するのに対し、実際の幅を取得するため、私が提案するimageTags[i].offsetWidth==400代わりに試してみてくださいimageTags[i].width==400
width.offsetWidth

于 2012-05-10T20:36:53.867 に答える
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 に答える