js中出现报错:net::ERR_FILE_NOT_FOUND的解决

这篇具有很好参考价值的文章主要介绍了js中出现报错:net::ERR_FILE_NOT_FOUND的解决。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

net::ERR_FILE_NOT_FOUND的意思是:网:错误_文件_没有找到,也就是说绑定数据源文件有问题。这时要检查是否是拼写错误、路径错误,或者是逻辑问题。

我的控制台报错如下:

js中出现报错:net::ERR_FILE_NOT_FOUND的解决

我的页面显示如下:

js中出现报错:net::ERR_FILE_NOT_FOUND的解决 

从这里可以看出,大致思路没问题,只是数据问题。

首先怀疑是否没有获取到数据,在绑定数据的函数中console.log(data)

发现控制台输出了数据(如下图),证明路径和拼写无误,那么就是逻辑问题了。

js中出现报错:net::ERR_FILE_NOT_FOUND的解决 

此时代码为:

js中出现报错:net::ERR_FILE_NOT_FOUND的解决 

 再从头顺一遍逻辑:

1.获取要绑定数据的位置

2.定义一个实名函数bindData,传递实参(lesson.online),lesson为对象,对象中有个数组online。lesson中不止有online一个数组

3.将bindData的返回值给到页面中。

4.编辑bindData,形参为data。定义空字符串str用来字符串拼接。最后返回str。

此时发现data为一个数组,用data直接点不能直接获得相应的属性,所以需要循环。

更改后的代码为:

 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数据为:文章来源地址https://www.toymoban.com/news/detail-512208.html

// 课程区域数据
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
    }]
}

到了这里,关于js中出现报错:net::ERR_FILE_NOT_FOUND的解决的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包赞助服务器费用

相关文章

  • Maven多仓库配置

    Maven多仓库配置

    有两种方式配置Maven多仓库 setting.xml文件的profiles标签 pom.xml文件的repositories标签 在使用多仓库配置时,不管使用哪种方式,必须先将setting.xml文件中的mirrors标签修改为如下内容(如果有mirrors标签),关键是mirrorOf千万不要写成*,否则多仓库配置不生效 两种方式可以同时使用

    2024年02月12日
    浏览(5)
  • python中cv2.projectPoints的用法

    python中cv2.projectPoints的用法

    我们先看一下c++ 中的参数解释 第一个输入的点是一个, (N, 3) 维的 三维坐标系中的点, xyz 第二个是旋转向量, 第三个是平移向量. 第四个是相机内参, 第五个是相机的畸变系数, 如果输入是4个时, 就是[k1, k2, p1, p2], 输入5个时就是 [k1, k2, p1, p2, k3], 也可以是更多, [k1, k2, p1, p2, k3,

    2024年02月06日
    浏览(9)
  • Unity - 记一次非正规变体优化带来的兼容性导致部分手机卡死的问题

    Unity - 记一次非正规变体优化带来的兼容性导致部分手机卡死的问题

    在 2023.4.6 我们的 角色展示界面 就遇到了 华为手机,red mi note 11 的测试手机上的 后 2023.5.24 再次遇到类似的问题,但是这次重现的地方很多,不单止 角色展示界面 遇到 排除过: 模型 特效 场景 人物 材质 后来多次排查,发现是 PBR 所有的 变体拆分优化 的文件导致阴影部分

    2024年02月08日
    浏览(13)
  • 关于出版《AR Foundation增强现实开发实战(ARKit版)》(2023-04-05更新)

    关于出版《AR Foundation增强现实开发实战(ARKit版)》(2023-04-05更新)

    感谢各位读者的支持,书籍目前已上市各大电商平台。 ----------- 2022年9月11日创建 ---------   ARKit是苹果公司在前沿科技领域的重大技术布局,也是目前移动领域AR应用开发引擎标杆。得益于良好的软硬件生态整合,ARKit运动跟踪稳定性好、性能消耗低、功能特性丰富,利用它

    2023年04月09日
    浏览(10)
  • iPXE 学习 部署Linux/Windows系统 支持IPv4/IPv6

    iPXE 学习 部署Linux/Windows系统 支持IPv4/IPv6

    折腾了一周的iPXE,大概弄明白了,ipxe原理 文件的具体作用就不讲了 自己也半懂不懂 不过有一说一 这可能是全网最完全的iPXE环境部署了 记录自己操作的每一个步骤 ┭┮﹏┭┮ 为了支持legacy BIOS 以及 UEFI 还要同时支持IPv4/IPv6 我先说一下  我的机器是多网卡  配置ipxe的端口

    2024年04月14日
    浏览(14)
  • Linux(openssl):通过编程检查证书是否为selfsign

     可以通过openssl提供的库函数验证 Linux(openssl):创建selfsign证书-CSDN博客 生成的正式是否为selfsign 

    2024年02月06日
    浏览(4)
  • unity 之 如何获取父物体与子物体

    unity 之 如何获取父物体与子物体

    在Unity中,你可以使用 Transform 组件的属性来获取对象的父物体。以下是在C#脚本中如何获取父物体的示例代码: 在这个示例中, transform 代表当前脚本所附着的物体的Transform组件。通过访问 transform.parent 属性,你可以获取当前物体的父物体。如果当前物体没有父物体(例如是

    2024年02月07日
    浏览(10)
  • PHP中读取(截取substr)字符串前N个字符或者从第几个字符开始取几个字符

    ```html ?php $str = \\\"123456789\\\";echo substr($str , 0 , 3);//从左边第一位字符起截取3位字符:结果:123echo substr($str , 3 , 3);//从左边第3位字符起截取3位字符:结果:456? ``` ```html ?php$rest = substr(\\\"abcdef\\\", -1);    // 返回 \\\"f\\\"$rest = substr(\\\"abcdef\\\", -2);    // 返回 \\\"ef\\\"$rest = substr(\\\"abcdef\\\", -3, 1); // 返回

    2024年02月20日
    浏览(8)
  • 深度学习:交叉验证(Cross Validation)

    深度学习:交叉验证(Cross Validation)

    首先,交叉验证的目的是为了让被评估的模型达到最优的泛化性能,找到使得模型泛化性能最优的超参值。在全部训练集上重新训练模型,并使用独立测试集对模型性能做出最终评价。 目前在一些论文里倒是没有特别强调这样的操作,很多研究使用的都是第一种:简单交叉验

    2024年02月02日
    浏览(10)
  • Linux复习——基础知识

    Linux复习——基础知识

    作者简介:一名云计算网络运维人员、每天分享网络与运维的技术与干货。   座右铭:低头赶路,敬事如仪 个人主页: 网络豆的主页​​​​​ 1. 有关早期linux系统中 sysvin的init的7个级别描述正确的是(    )[选择1项] A. init 1 关机状态     B. init 2 字符界面多用户模式

    2024年02月15日
    浏览(11)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包