jQuery是一個(gè)廣泛使用的JavaScript庫,它可以讓處理網(wǎng)頁事件、動(dòng)畫、DOM操作等變得更加簡單。其中,獲取網(wǎng)頁中的圖片是一個(gè)常見的需求。本文將介紹如何使用jQuery img批量獲取網(wǎng)頁中的圖片。
首先,在HTML文件中引入jQuery庫:
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
然后,在JavaScript文件中進(jìn)行如下操作:
$('img').each(function() { // 獲取圖片地址 var src = $(this).attr('src'); console.log(src); });
上述代碼通過jQuery的each方法,遍歷每個(gè)img標(biāo)簽,并使用attr方法獲取對應(yīng)的src屬性值。將獲取到的圖片地址輸出到控制臺中。
如果要將所有獲取到的圖片地址存儲(chǔ)到一個(gè)數(shù)組中,可以使用如下代碼:
var imgList = []; $('img').each(function() { var src = $(this).attr('src'); imgList.push(src); }); console.log(imgList);
上述代碼定義了一個(gè)空數(shù)組imgList,遍歷每個(gè)img標(biāo)簽,并將獲取到的src屬性值存儲(chǔ)到數(shù)組中。最后,將整個(gè)數(shù)組打印到控制臺中。
總結(jié):使用jQuery img批量獲取網(wǎng)頁中的圖片是非常簡單的,只需要使用each方法遍歷每個(gè)img標(biāo)簽,并使用attr方法獲取對應(yīng)的src屬性值即可。如果需要將獲取到的所有圖片地址存儲(chǔ)到一個(gè)數(shù)組中,可以使用push方法實(shí)現(xiàn)。