第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

如何在不在 javascript 中手動輸入每個圖像文件的情況下從文件夾循環(huán)圖像?

如何在不在 javascript 中手動輸入每個圖像文件的情況下從文件夾循環(huán)圖像?

慕容森 2023-03-03 09:40:31
我想隨機循環(huán)文件夾中存在的所有圖像。目前,我能夠一張一張地手動輸入每張圖片并顯示出來。但我希望該功能能夠從給定的文件夾中自行顯示圖像。JSfunction rndmImg() {        var qs = [            {            text: "1",            img:  "/Images/1.png"            },            {            text: "2",            img:  "/Images/2.png",            },            {            text: "3",            img:  "/Images/3.png",            },            {            text: "4",            img:  "/Images/4.png",            },            {            text: "5",            img:  "/Images/5.png",            },        ];        var q = qs[Math.floor(Math.random() * qs.length)];        document.getElementById("q").innerHTML =            '<p>' + q.text + '</p>' +            '<img src="' + q.img + '">';        }HTML<div id="quote"></div>        <input class="Click me" style="float: left;" type="button"         value="Randomize" onclick="rndmImg()">
查看完整描述

1 回答

?
寶慕林4294392

TA貢獻2021條經(jīng)驗 獲得超8個贊

因此,客戶端 JavaScript,即使在本地服務(wù)器上運行,實際上也無法訪問本地文件系統(tǒng),因此典型的服務(wù)器端或命令行命令(如 readdir、cd ls 等)實際上并不存在于客戶端 JavaScript 中


話雖如此,如果它運行在某種服務(wù)器/某種靜態(tài) http 服務(wù)器上,您應(yīng)該能夠使用 XMLHttpRequest 獲取主目錄,或者獲取、讀取鏈接,然后循環(huán)遍歷圖像等


事實上,如果不首先在某種服務(wù)器上運行,客戶端 JavaScript 無法讀取任何外部文件的字節(jié),除非它是由用戶選擇的


因此,如果您使用 pythons http_server 模塊在端口 770 上運行本地靜態(tài)服務(wù)器,例如,然后獲取文件


fetch("http://localhost:770/Images")

.then(r=>r.text())

.then(r=>{

    var p=new DOMParser ()

    var s=p.parseFromString(r,"text/html")

    var links=Array.from(s.querySelectorAll("a"))

    var fileNames= links.map(x=>x.href)

})

(假設(shè)該目錄中沒有 index.html)


話雖如此,您的文件似乎都遵循遞增一個的模式。如果它們都遵循一個已知的模式,你根本不需要服務(wù)器,你可以簡單地在 JavaScript 中動態(tài)創(chuàng)建新的 Image 對象,并為每個對象設(shè)置一個 onload 函數(shù)和一個 onerror 函數(shù),只添加沒有的錯誤,或者繼續(xù)遞歸加載它們,除非其中一個有錯誤,當它有錯誤時,它會告訴你模式已經(jīng)被破壞,你不需要服務(wù)器


所以假設(shè)模式是名稱遞增一個,從 1.png 開始,那么你可以在每個元素中生成一個對象數(shù)組,其中包含名稱和圖像對象本身,就像這樣


makeObjectArray (1, "Images/", ".png", it=>{

    console.log(it)

})

function makeObjectArray(cur,start,end, done) {

     var ar=[]

    get1()

    function get1() {

        var im= new Image()

        im.src=start+ (cur++)+end

        im.onload=()=> (ar.push(im),get1())

        im.onerror=()=>done (ar)

    }

}


查看完整回答
反對 回復 2023-03-03
  • 1 回答
  • 0 關(guān)注
  • 122 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學習伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號