1

配列を調べてサイズを変更することで、一連の画像のサイズを変更しようとしています

if(items[0].height > 700 || items[0].width > 700){
  items[0].style.height = "700px";
   items[0].style.width = "700px";
}

画像をトリミングしようとしてキャンバスで遊んでいるときに、トリミングに指定した座標が期待どおりにカットされていないことに気付きました。

img.style.height は表示プロパティのみを変更し、img.height は img の実際の寸法を変更すると仮定しますか? それとも彼らは同じことをしますか？

4

2 に答える 2

3

img.height要素の高さ属性をimg.style.height参照し、スタイルとして定義された高さを参照します (CSS のように)

為に

img.height20になります。

為に

<img id="example" style="height:20">

img.style.heightスタイルを設定する場合は、通常、スタイルを使用し、高さを属性としてハードコーディングすることに対する懸念を分離することをお勧めします。したがって、この場合、おそらく画像にクラスを設定し、高さを CSS に入れます。

スタイルを読んでいる場合はimg.height、設定に関係なく実際の高さを返すため、より安全です。

于 2013-03-27T15:39:37.660 に答える
1

私が見つけた主な違い（@ ben336で説明されている属性の性質以外）は、それらが表現できるものにあります。

  • img.heightは常に高さをピクセル単位で表します。これは HTML5 にのみ当てはまります。これは、タグに基づいて使用していると推測されます。HTML の以前のバージョンでは、パーセンテージとピクセルの両方を img.height で指定できるため、私の主張は意味がありません。

    img.height = 20; // Always means 20 pixels.

  • 一方、 img.style.heightは高さをピクセル単位または元のサイズのパーセンテージで表します。

    img.style.height = 20px; // 20 pixels in height;

    また

    img.style.height = 20%; // 20% of original height.
于 2013-03-27T15:47:51.457 に答える