jQuery是一款流行的JavaScript庫(kù),可以大大簡(jiǎn)化JavaScript代碼的編寫(xiě)。在網(wǎng)頁(yè)制作過(guò)程中,經(jīng)常需要設(shè)置圖片自適應(yīng)寬度,使用jQuery可以輕松實(shí)現(xiàn)。
$("img").each(function(){ var imgWidth = $(this).width(); // 獲取圖片原始寬度 var parentWidth = $(this).parent().width(); // 獲取圖片父元素寬度 if(imgWidth > parentWidth){ $(this).css("width", "100%"); // 設(shè)置圖片寬度為父元素寬度 } });
上面的代碼使用了each()方法對(duì)選中的所有img元素進(jìn)行循環(huán)處理。首先獲取每個(gè)圖片的原始寬度和父元素寬度,如果圖片的原始寬度大于父元素寬度,則設(shè)置圖片寬度為100%。
這段代碼非常簡(jiǎn)單易懂,即使是初學(xué)者也可以快速掌握。除了圖片自適應(yīng)寬度,jQuery還可以實(shí)現(xiàn)許多實(shí)用的功能,值得進(jìn)一步研究和學(xué)習(xí)。