img的src如果访问显示403,怎么才能访问第二个链接?

要在 img 元素的 src 属性中实现逻辑,以在无法访问到 403 错误的情况下使用第二个链接,你可以使用 JavaScript 来处理。

**以下是一个示例代码,演示了如何检查第一个链接是否返回 403 错误,并在发生错误时使用第二个链接:**javascript plainconst imgElement = document.querySelector('img');imgElement.addEventListener('error', () => { // 第一个链接返回错误,使用第二个链接 imgElement.src = '第二个链接';});在上述示例中,我们首先使用 document.querySelector('img') 获取到 img 元素。然后,我们通过为 img 元素添加 error **事件监听器来检测第一个链接是否返回错误。当图片加载发生错误时,error 事件会触发回调函数。在回调函数中,我们将 img 元素的 src **属性修改为第二个链接,从而加载第二个图片链接。你需要将代码中的 '第二个链接' **替换为你实际要使用的第二个图片链接。**请注意,这段代码应在页面加载完成后执行,以确保 img 元素已经存在于 DOM 中。你可以将代码放在 DOMContentLoaded load **事件处理程序中,或者在脚本的适当位置执行。**这样,当第一个链接返回 403 错误时,就会自动切换到第二个链接,以确保图片能够正确加载。

相关推荐
星栈16 小时前
写 Dioxus Demo 不难,难的是把它写成项目
前端·rust·前端框架
用户2204603958682 天前
HBuilder + uniapp 项目切换到VsCode
前端框架
薛定喵的谔2 天前
我开源了一个精致的 Next.js 博客模板:Skyplume
前端·前端框架·next.js
星栈2 天前
我用 Rust + Dioxus 做了个全栈跨平台笔记应用:再把新建、编辑和交付补上
前端·rust·前端框架
donecoding2 天前
3 条命令搞定闭环 Monorepo:Lerna 版本管理 + 拓扑构建 + 自定义分发
前端·前端框架·node.js
星栈3 天前
我用 Rust + Dioxus 做了个全栈跨平台笔记应用:第一版先把列表和详情跑通
前端·rust·前端框架
下家4 天前
我放弃了 Vue/React,选择自研框架
前端·前端框架
hoLzwEge4 天前
pnpm-lock.yaml
前端框架
星栈4 天前
Dioxus 接数据库最容易写歪的 3 个地方:sqlx + SQLite 怎么接才顺
前端·rust·前端框架
星栈4 天前
Dioxus 表单处理:从输入、校验到文件上传,一条链路讲透
前端·rust·前端框架