jQuery 是一個功能強大的 JavaScript 庫,被廣泛應用于 Web 開發中。在 Web 頁面中,圖片顯示是非常常見的需求。而在圖片顯示的時候,經常需要設置圖片的寬度和高度。下面我們來看看如何使用 jQuery 設置圖片的寬高。
// 設置圖片寬度為 200 像素 $('img').width(200); // 設置圖片高度為 150 像素 $('img').height(150); // 同時設置圖片的寬度和高度 $('img').css({ 'width': '200px', 'height': '150px' });
以上代碼中,第一和第二行分別使用了width()
和height()
方法來設置圖片的寬度和高度。這兩個方法都可以接受一個數值參數,用于指定圖片的寬度和高度。需要注意的是,這里的數值參數會自動添加單位像素(px)。
第三行代碼中,我們使用了css()
方法,它可以同時設置多個CSS屬性。這里我們將width
和height
兩個屬性都設置為指定的值。需要注意的是,這里必須添加單位像素(px),否則會報錯。
除了上述方法外,還可以使用attr()
方法來設置圖片的寬度和高度屬性。具體代碼如下:
// 設置圖片寬度為 200 像素 $('img').attr('width', '200'); // 設置圖片高度為 150 像素 $('img').attr('height', '150');
這里我們通過attr()
方法來分別設置圖片的寬度和高度屬性。需要注意的是,這里的值不需要添加單位像素(px),直接輸入數值即可。
總之,使用 jQuery 設置圖片的寬度和高度是非常方便的。我們可以根據實際需求選擇合適的方法來完成設置。