阿里图标库——批量下载图标

简介: 阿里图标库——批量下载图标

使用购物车实现批量下载

特别提醒:因官网批量下载数量限制,以下案例中都最多只能选择20个图标。

批量下载图标,需要先将图标添加入库【“购物车”】,再下载

选择颜色和大小,点击格式就会触发下载,推荐SVG

批量添加页面中的图标入库

方法1:手动选择需要的图标添加入库

方法2:运行代码批量添加入库

按F12打开控制台,运行代码

var iconList = document.querySelectorAll('.icon-gouwuche1');
  for (var i = 0; i < 20; i++) {
  iconList[i].click();
}

就会发现页面中的前20个图标已添加入库

若想下载后续20个图标,则执行

var iconList = document.querySelectorAll('.icon-gouwuche1');
  for (var i = 20; i < 40; i++) {
  iconList[i].click();
}

后续同理,不断改变 i 的初始值和最大值即可。

批量添加项目中的图标入库

点击选择要下载的图标,点击“批量加入购物车”


若项目中图标总数不超过20个,则直接点击右侧的全选按钮,再添加到购物车

 

目录
相关文章
|
4月前
|
小程序 开发者
【微信小程序-原生开发】实用教程05-首页(含自定义调试模式、插入图片、图文排版、底部留白、添加本地图片)
【微信小程序-原生开发】实用教程05-首页(含自定义调试模式、插入图片、图文排版、底部留白、添加本地图片)
53 0
|
6月前
利用 HBuilderX 设置新闻中心版式
利用 HBuilderX 设置新闻中心版式
89 2
利用 HBuilderX 设置新闻中心版式
|
4月前
仿照微信朋友圈中点击图片出现大图浏览效果
仿照微信朋友圈中点击图片出现大图浏览效果
63 0
|
6月前
|
API
uniapp点击图片放大预览
uniapp点击图片放大预览
369 0
|
6月前
flutter中使用图标(含自制图标库方案)
flutter中使用图标(含自制图标库方案)
1524 0
|
小程序 开发者
微信小程序系列——点击图片放大预览
微信小程序系列——点击图片放大预览
uniapp使用阿里图标
uniapp使用阿里图标
684 0
|
前端开发
前端代码分享——霓虹灯图标菜单特效(内含源码)
前端代码分享——霓虹灯图标菜单特效(内含源码)
|
前端开发
图标库的正确使用方式
今天来教大家在实际开发中引入图标库
604 2
图标库的正确使用方式
|
图形学
PPT制作三大技巧:图标 、图片背景透明和自动函数
PPT制作三大技巧:图标 、图片背景透明和自动函数
287 0
PPT制作三大技巧:图标 、图片背景透明和自动函数