使用jQuery/JavaScript 從資料夾載入圖片
取得給定資料夾中所有圖片檔案的清單並將其顯示在網頁是前端開發的常見任務。要實現這一目標，可以使用強大的 JavaScript 和 jQuery 技術。
從「images」資料夾載入圖片
考慮一種場景，其中您有一個名為「images」的資料夾" 包含映像檔。要使用jQuery/JavaScript 將此資料夾中的所有圖片載入到HTML頁面中，請按照以下步驟操作：
<code class="javascript">// Define the folder path
var folder = "images/";
// Use AJAX to retrieve the folder contents
$.ajax({
url: folder,
success: function (data) {
// Parse the response data
$(data).find("a").attr("href", function (i, val) {
// Check if the file is an image
if (val.match(/\.(jpe?g|png|gif)$/)) {
// Append the image to the body of the page
$("body").append("<img src='" + folder + val + "'>");
}
});
}
});</code>此程式碼片段利用AJAX 來檢索「images」資料夾的內容。使用jQuery將映像動態附加到文件正文。
對於像Express for Node 這樣的伺服器，您可能需要安裝serve-index NPM包才能啟用資料夾清單。以上是如何使用 jQuery/JavaScript 從資料夾動態載入圖片？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
