Error reported in js: net::ERR_FILE_NOT_FOUND solution

net::ERR_FILE_NOT_FOUND means: net: error_file_not found, which means there is a problem with the binding data source file. At this time, check whether there are spelling errors, wrong paths, or logical problems.

My console error is as follows:

My page looks like this:

 

It can be seen from here that the general idea is fine, it is just a data problem.

First of all, I wonder if the data is not obtained. In the function that binds data, console.log(data)

It is found that the console outputs data (as shown below), which proves that the path and spelling are correct, then it is a logic problem.

 

The code at this time is:

 

 Let’s go through the logic again:

1. Get the location of the data to be bound

2. Define a real-name function bindData, pass the actual parameters (lesson.online), lesson is an object, and there is an array online in the object. There is more than one array online in lesson

3. Give the return value of bindData to the page.

4. Edit bindData, the formal parameter is data. Define the empty string str for string concatenation. Finally returns str.

At this time, it is found that data is an array, and the corresponding attributes cannot be directly obtained by using data directly, so a loop is required.

The changed code is:

 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}人在学习`:` <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}课时</span>`:` <span>${data.title}</span>`}
                    </div>
                    <div class="right">免费学习</div>
                </div></li>`

        return str;
    }

lesson.online data is:

// 课程区域数据
var lesson = {
    online: [
        {
        title: '行政管理专业班1',
        src: './img/index/banner1.png',
        cont: '人教版',
        time: 23,
        isFree: true,
        num: 1100
    }, {
        title: '行政管理专业班2',
        src: './img/index/banner2.png',
        cont: '沪教版',
        time: 23,
        isFree: true,
        num: 1100
    }, {
        title: '行政管理专业班3',
        src: './img/index/banner3.png',
        cont: '人教版',
        time: 23,
        isFree: true,
        num: 1100
    }, {
        title: '行政管理专业班4',
        src: './img/index/banner4.png',
        cont: '人教版',
        time: 22,
        isFree: true,
        num: 1100
    }, {
        title: '行政管理专业班5',
        src: './img/index/banner5.png',
        cont: '沪教版',
        time: 33,
        isFree: true,
        num: 1100
    }, {
        title: '行政管理专业班7',
        src: './img/index/banner7.png',
        cont: '人教版',
        time: 44,
        isFree: true,
        num: 1100
    }, {
        title: '行政管理专业班6',
        src: './img/index/banner6.png',
        cont: '人教版',
        time: 33,
        isFree: true,
        num: 1100
    }, {
        title: '行政管理专业班8',
        src: './img/index/banner8.png',
        cont: '人教版',
        time: 44,
        isFree: true,
        num: 1100
    }]
}