net::ERR_FILE_NOT_FOUND的意思是：網(wǎng)：錯(cuò)誤_文件_沒(méi)有找到，也就是說(shuō)綁定數(shù)據(jù)源文件有問(wèn)題。這時(shí)要檢查是否是拼寫錯(cuò)誤、路徑錯(cuò)誤，或者是邏輯問(wèn)題。

我的控制臺(tái)報(bào)錯(cuò)如下：

我的頁(yè)面顯示如下：

?

從這里可以看出，大致思路沒(méi)問(wèn)題，只是數(shù)據(jù)問(wèn)題。

首先懷疑是否沒(méi)有獲取到數(shù)據(jù)，在綁定數(shù)據(jù)的函數(shù)中console.log(data)

發(fā)現(xiàn)控制臺(tái)輸出了數(shù)據(jù)（如下圖），證明路徑和拼寫無(wú)誤，那么就是邏輯問(wèn)題了。

?

此時(shí)代碼為：

?

?再?gòu)念^順一遍邏輯：

1.獲取要綁定數(shù)據(jù)的位置

2.定義一個(gè)實(shí)名函數(shù)bindData，傳遞實(shí)參（lesson.online），lesson為對(duì)象，對(duì)象中有個(gè)數(shù)組online。lesson中不止有online一個(gè)數(shù)組

3.將bindData的返回值給到頁(yè)面中。

4.編輯bindData，形參為data。定義空字符串str用來(lái)字符串拼接。最后返回str。

此時(shí)發(fā)現(xiàn)data為一個(gè)數(shù)組，用data直接點(diǎn)不能直接獲得相應(yīng)的屬性，所以需要循環(huán)。

更改后的代碼為：

 function bindData(data){
        console.log(data)
        //定義空字符串
        var str = "";

        //字符串拼接
        //同步課程
        str += `<li> <div class="top">
                    <span class="rj">${data.cont}</span>
                    <img src="${data.src}" alt="" class="m">
                    <p>${data.isFree ? `${data.num}人在學(xué)習(xí)`:` <span>${data.num}人已考試</span><span>${data.time}</span>`}</p>
                </div>
                <div class="bottom">
                    <div class="left">
                       ${data.isFree ? `<span>${data.title}</span>
                       <span class="time">${data.time}課時(shí)</span>`:` <span>${data.title}</span>`}
                    </div>
                    <div class="right">免費(fèi)學(xué)習(xí)</div>
                </div></li>`

        return str;
    }

lesson.online數(shù)據(jù)為：文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-512208.html

// 課程區(qū)域數(shù)據(jù)
var lesson = {
    online: [
        {
        title: '行政管理專業(yè)班1',
        src: './img/index/banner1.png',
        cont: '人教版',
        time: 23,
        isFree: true,
        num: 1100
    }, {
        title: '行政管理專業(yè)班2',
        src: './img/index/banner2.png',
        cont: '滬教版',
        time: 23,
        isFree: true,
        num: 1100
    }, {
        title: '行政管理專業(yè)班3',
        src: './img/index/banner3.png',
        cont: '人教版',
        time: 23,
        isFree: true,
        num: 1100
    }, {
        title: '行政管理專業(yè)班4',
        src: './img/index/banner4.png',
        cont: '人教版',
        time: 22,
        isFree: true,
        num: 1100
    }, {
        title: '行政管理專業(yè)班5',
        src: './img/index/banner5.png',
        cont: '滬教版',
        time: 33,
        isFree: true,
        num: 1100
    }, {
        title: '行政管理專業(yè)班7',
        src: './img/index/banner7.png',
        cont: '人教版',
        time: 44,
        isFree: true,
        num: 1100
    }, {
        title: '行政管理專業(yè)班6',
        src: './img/index/banner6.png',
        cont: '人教版',
        time: 33,
        isFree: true,
        num: 1100
    }, {
        title: '行政管理專業(yè)班8',
        src: './img/index/banner8.png',
        cont: '人教版',
        time: 44,
        isFree: true,
        num: 1100
    }]
}

到了這里，關(guān)于js中出現(xiàn)報(bào)錯(cuò)：net::ERR_FILE_NOT_FOUND的解決的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！