【vue】使用无障碍工具条(详细)

news/2025/2/15 15:27:07/

引入:使用的是太阳湾的无障碍工具条,代码地址:https://gitee.com/tywAmblyopia/ToolsUI
具体步骤:下载代码后,将其中的 canyou 文件夹拖入 vue 项目中的 public 文件夹中;
在这里插入图片描述
上图是在项目目录中的样子,记得不要改文件夹的名字,就叫 canyou
然后在 vue 项目中的 public/index.html 文件中引入 1.8 以上版本的 jquery,和 canyou 文件夹中的 wza.min.js 文件,最后在 <body> 中引入

<a id="wzayd" title="网站信息无障碍工具条" href="javascript:;" class="wzayd" accesskey="g">无障碍阅读</a> 

如图:
在这里插入图片描述
我 jquery 引入的方式是 cdn 引入,如果改为本地导入会出现报错:
在这里插入图片描述
演示:
在这里插入图片描述


http://www.ppmy.cn/news/1093113.html

相关文章

前端面试0906

// 请给出输出结果 function foo(){ console.log(a); } function bar(){ var a 3; console.log(this.a); foo(); } var a 2; bar(); 2 2 // 请从下面的问题中挑选3道进行回答 1. 防抖和节流分别是什么&#xff0c;一般用在什么场景&#xff1f; 防抖&#xff08;Debounc…

Tugraph图学习技术详解

文章目录 TuGraph图学习目录图学习典型工作流程整体学习架构加速稀疏计算GPC编译加速 编译加速编译加速流水线GPCSPMM和SDDMM优化SPMM DSL代码生成SDMM DSL代码生成AutoTune-Cost Model 加速效果一键加速 TuGraph图学习实践目录TuGraph采样TuGraph采样算子全图训练采样算子介绍…

Ubuntu22.04 install Kafka

kafka quickstart install kafka

Socks5代理IP:保障跨境电商的网络安全

在数字化时代&#xff0c;跨境电商已成为全球商业的重要一环。然而&#xff0c;随着其发展壮大&#xff0c;网络安全问题也逐渐浮出水面。为了确保跨境电商的安全和隐私&#xff0c;Socks5代理IP技术成为了一项不可或缺的工具。本文将深入探讨Socks5代理IP在跨境电商中的应用&a…

iTOP-RK3568开发板内核模块实验-设置交叉编译器

在上一章节我们编写了最简单的 helloworld 驱动程序。有了驱动程序以后&#xff0c;要如何编译并使用驱动呢。编译驱动有俩种方法&#xff0c;分别是将驱动编译成内核和将驱动编译成内核模块。我们先来学习如何将驱动编译成内核模块、 4.1 设置交叉编译器 1 下载网盘资料下的…

服务注册与服务发现

服务注册与服务发现 Eureka的架构 Eureka客户端&#xff1a;使用了EnableEurekaClient注解的应用服务&#xff0c;如订单服务等&#xff0c;甚至Eureka本身也是一个客户端 Eureka服务端&#xff1a;使用了EnableEurekaServer注解的应用服务&#xff0c;该服务提供了注册表以及…

mybatis-plus填充功能,自动设置值

1、引入依赖 <!-- mybatis-plus--><dependency><groupId>com.baomidou</groupId><artifactId>mybatis-plus-boot-starter</artifactId><version>3.4.1</version></dependency> 2、编写entity Data AllArgsConst…

如何阻止事件冒泡(event bubbling)?

聚沙成塔每天进步一点点 ⭐ 专栏简介⭐ 原生 JavaScript⭐ jQuery⭐ React⭐Vue.js⭐ 写在最后 ⭐ 专栏简介 前端入门之旅&#xff1a;探索Web开发的奇妙世界 记得点击上方或者右侧链接订阅本专栏哦 几何带你启航前端之旅 欢迎来到前端入门之旅&#xff01;这个专栏是为那些对…