HTML导入文件URL错误的解决方法

文件导不入好烦啊

在写GUI的时候,我们导入图片也可能失败,有的时候根本导不进去,就很烦人……
要写绝对路径or相对路径,注意是\还是/……

HTML5的导入也好不到哪去,甚至犹有过之……
对于刚接触的人可能发现,比如我写这样的代码:

<!DOCTYPE html>
<html>
  <head>
    测试测试测试
  </head>
  <body>
    <h1>音频播放</h1>
    <audio src="D:/HTML5/multimedia/Last_Stop.mp3" controls>
      浏览器不支持audio元素
    </audio>
  </body>
</html>

这个HTML文件在浏览器里是这样的:
在这里插入图片描述
前端嘛,有时候,不报错但你就是实现不了功能,更让你头秃……

此时如果冷静分析,我们就知道,文件URL错了,没导入成功……

URL怎么改

写绝对路径,不能写成这样:“D:/HTML5/multimedia/Last_Stop.mp3”,而是"file:///D:/HTML5/multimedia/Last_Stop.mp3"

我是用的Atom文本编辑器,改前是这样的:
在这里插入图片描述

改后是:

在这里插入图片描述

这就表示URL链接有效。

正确运行示例

在这里插入图片描述

完整代码

<!DOCTYPE html>
<html>
  <head>
    测试测试测试
  </head>
  <body>
    <h1>音频播放</h1>
    <audio src="file:///D:/HTML5/multimedia/Last_Stop.mp3" controls>
      您的浏览器不支持audio元素
    </audio>
  </body>
</html>

总结

本文难度不大,但对刚接触HTML的人可能遇到的问题——文件URL不正确/导入文件失败 给出了解决方法,还望对困惑者有所帮助……

这种URL不仅仅是音频,还有图片、视频等,都是类似的呀。

发布了505 篇原创文章 · 获赞 999 · 访问量 19万+

猜你喜欢

转载自blog.csdn.net/weixin_43896318/article/details/104304776