Namun lebih jQuery–Mengubah ukuran gambar contoh

Saya mewarisi bagian web dari klien vendor tua dan memiliki masalah ukuran gambar. Gambar harus 60×50 tapi untuk beberapa alasan aneh, vendor asli memaksa mereka ke dalam 42×42, begitu mereka melihat tergencet:

Baik gambar	Citra buruk

Berikut adalah markup (agak sederhana):

<Tabel kelas = 'diperpanjang-outlook'>
<thead>
    <TR>
      <th lebar ='100′>3 Selasa</th>
    </TR>
</thead>

<tbody>
    <kelas TR = 'ramalan'>
      <lebar TD ='100′>
        <UL>
          <Li kelas = 'tinggi'>Tinggi: 72°F</Li>
          <Li kelas = 'rendah'>Rendah: 44°F</Li>
          <Li kelas = 'kondisi'>Cerah
            <img src =’http://deskwx.weatherbug.com/images/Forecast/icons/localized/60×50/en/Trans/cond007.png’ lebar ='42’ tinggi ='42’ Alt =” />
          </Li>
        </UL>
      </TD>
    </TR>

</tbody>

</Meja>

Anda akan perhatikan bahwa meskipun path ke gambar sendiri menunjukkan dimensi yang tepat (60×50) vendor asli memaksa dalam 42×42. Mengapa? Gila.

Pokoknya, Saya menginginkan solusi cepat dan mudah untuk masalah ini dan aku berpaling untuk jQuery. Triknya adalah untuk menemukan semua yang sesuai <img> Tag. Aku tidak ingin Bergelandangan dengan tag img lain (yang ada banyak). Ini sedikit jQuery melakukan trick:

<jenis script = text/javascript"" src ="http://Ajax.googleapis.com/Ajax/libs/jQuery/1.5/jQuery.min.js"></script>

<script type = "text/javascript">
     $(dokumen).siap(fungsi () {

         $(' li.condition > img').masing-masing(fungsi (Indeks, item)
            {
             $(item).CSS("lebar", "60");
             $(item).CSS("tinggi", "50");
            });
     }); // pada beban dokumen
</script>

Sedikit kode menemukan koleksi <Li> Tag kelas yang adalah "kondisi" dan <img> anak-anak. Ini kemudian iterates melalui semua itu. Bekerja seperti pesona.

Aku mungkin bisa merampingkan, tapi aku tidak pernah tipe orang unix yang dipecahkan π untuk 18 digit presisi menggunakan sed dan awk dan aku tidak seperti itu jika jQuery pria baik Tersenyum .