静态资源文件的使用

网站程序中的所有图片、文本或其它资源文件都必须存放在项目根目录中的 static 文件夹中。

在页面代码中使用时，需带上 ./static/ 前缀。

网站开发常见的资源文件

字体文件：用于引入自定义字体，常见格式有 .ttf、.woff、.woff2 等。

音频文件：用于网页中的音效、背景音乐等，常见格式有 .mp3、.wav、.ogg 等。

视频文件：用于网页中的视频内容，常见格式有 .mp4、.webm、.ogg 等。

图标文件：用于网页中的各种图标，常见格式有 .ico、.svg 等，也可以使用图标字体库如 Font Awesome。

数据文件：用于存储网页需要的数据，常见格式有 .json、.xml、.csv 等。

PDF 文件：用于在网页中嵌入或链接 PDF 文档。

SVG 文件：用于矢量图形，可以直接嵌入 HTML 或作为单独文件引用。

代码使用示例

' 1.图片资源文件的使用

图片框1.图片 = "./static/logo.jpg"

' 2.自定义字体文件的使用

添加字体文件("myfont","./static/fonts/custom.font.ttf",()=>{

标签1.字体 = "myfont"

})

' 3.播放音频文件

音频播放器1.音频地址 = "../static/music2.mp3"

' 自动播放限制：现代浏览器（Chrome、Firefox、Safari 等）都实现了自动播放策略，但要求用户必须先与页面交互才能播放媒体。

' Promise 拒绝：开始播放函数 返回一个 Promise，当播放被阻止时，这个 Promise 会被拒绝并抛出 NotAllowedError。

' 安全策略：这是浏览器的安全机制，防止网站在用户不知情的情况下播放音频或视频。

' 因此下方两句代码在大部分浏览器中不会生效、必须让用户点击才能播放

'音频播放器1.自动播放 = 真

'音频播放器1.开始播放()

' 4、播放视频文件、由于本地没有找到合适的小素材资源文件作演示，这里使用菜鸟教程里面的一个视频地址

视频播放器1.视频地址 = "https://www.runoob.com/try/demo_source/movie.mp4"

' 视频宽度和元素宽度要手动设置保持一致

视频播放器1.视频宽度 = 320

视频播放器1.视频高度 = 240

' 5.图标文件、图标文件比较简单，只需要在编译输出的项目根目录中

' 放置一个名称为：favicon.ico 的图标文件即可，不需要做其它处理

' 6.置SVG图片

SVG图像框1.置SVG代码("")

SVG图像框2.加载SVG文件("./static/timer.svg")

读取JSON或文本文件内容

事件 按钮1.被单击(源对象,事件源)

' 读取JSON数据文件，并解析

' 注意：不能直接在浏览器中打开html页面，需要有服务器环境

调试输出("读取JSON文件：")

读JSON文件("./static/jsondata.json",(JSON对象)=>{

调试输出(JSON对象)

},真)

结束 事件

事件 按钮2.被单击(源对象,事件源)

读文本文件("./static/data.txt",(文本内容)=>{

调试输出(文本内容)

})

结束 事件

注意：

除了图片、音视频资源与脚本文件之外，使用其它任何资源文件时，都必须在本地服务器环境中打开页面才有效，直接在浏览器中打开 .html 文件将无效。