图标选择器之批量复制阿里云图标名称和图标代码

在项目中需要做一个图标选择器，使用的是阿里云图标，所以需要复制阿里云项目里的全部图标名称和图标代码…一个项目中有几十甚至上百个图标，一个个复制会很费劲 O__O "…

F12打开控制台粘贴以下代码并回车

//图标代码
let icon = document.querySelectorAll('.icon-item >.icon-code-show');
//图标名
let name =document.querySelectorAll('.icon-item >.icon-name');
let p =[]
for (var i = 0 ; i < icon.length; i++) {//数组这可以拼成自己想要的任意格式
p.push({name: name[i].innerHTML,iconname: icon[i].innerHTML,})
}
console.log(p)

2.在打印出的结果上右键复制数组

效果如下：

注：
图标得加入到“我的项目”中，也就是能复制代码的状态

附：vuecli通过symbol引用阿里iconfont图标使用介绍

图标选择器之批量复制阿里云图标名称和图标代码相关推荐

阿里云code结合git管理代码，运用webHook同步部署服务器代码（php）
项目场景: 阿里云code结合git管理代码,运用webHook同步部署服务器代码(php) 问题描述: git生成密钥时linux用户为root,php运行用户是www.结果导致在服务器端git p ...
如何选择适合自己的阿里云服务器规格类型？
阿里云服务器拥有非常多的实例规格族,大家在选型的时候可以对比实例性能,来选择适合自己的型号. 对于阿里云实例规格名称的命令,部分小写字母的含义如下: c:一般表示计算型(computational) ...
python实现批量变更阿里云DNS解析记录状态
包含两个脚本,一个是阿里云和维格表的同步脚本ali_dns.py,另一个是执行阿里云解析记录的开启暂停脚本ali_modify.py. 使用阿里云的sdk,ali_dns.py将所有域名解析拉取后写入 ...
个人用户怎样选择最适合的阿里云服务器？
本系列教程汇总: 买了域名一定需要备案吗?什么情况下不需要备案? 如何购买阿里云服务器(图文教程) 如何购买阿里云香港服务器(图文教程) 如何购买阿里云学生服务器(图文教程) 阿里云是国内第一大云服务 ...
STM32F103C8T6通过ESP8266连接阿里云物联网平台（附代码）
代码: https://download.csdn.net/download/cainiaofu/13973012 阿里云lot Studio控制 Web开发(程序已精简) 分享一下自己使用stm32 ...
阿里云短信验证（代码）demo完整教程
前言: 使用阿里云短信服务的前提你得有阿里云账号(我简直在说废话)没有得话就去注册一个注册后登陆教程开始: 阿里云上面有官方得文档以及Demo&SDK,为什么我还要写这篇播客呢,因为上面的 ...
还在自建代码仓库？阿里云的这款企业级代码管理工具免费、还香！
简介:代码托管产品是软件研发过程中的必备工具,不少企业在进行代码托管工具选型的时候会选择开源工具自建,然而,开源版本的代码管理工具往往只是提供了基础的代码仓储能力,无法满足企业在安全性.代码质量.权限 ...
微信小程序上传阿里云视频文件流程及代码
为了微信小程序客服端实现自拍视频能够分享给多个好友,我们需要把小程序自拍的视频存储到服务器,而阿里云在性能和速度上比较不错,所以我们选择了阿里云作服务器. 第一步.微信小程序项目创建 1. 到http ...
记一次阿里云ECS被挂挖矿代码的处理历程
起因: 公司手机收到阿里云提示短信,检测到ECS服务器出现紧急安全事件:访问恶意下载源于是访问阿里云管理平台查看到如下信息处理过程一: 连接到服务器,htop查看到有可疑进程,吃掉了服务器2vcp ...

图标选择器之批量复制阿里云图标名称和图标代码

图标选择器之批量复制阿里云图标名称和图标代码相关推荐

最新文章

热门文章