批量替换字符串，将其中的数字递增（两种方法）和circlr.js插件的使用

使用circlr.js插件实现3D效果的时候，不想在JS中写追加，直接写html又太麻烦（使用的是HBuilder X），所以找到了两种批量替换字符串，将其中的数字递增的方法。

想要实现的效果：

1. Microsoft Excel 使用自动填充序列和公式相加

2. 使用VS Code

circlr.js插件使用例子：

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title><link rel="stylesheet" type="text/css" href="css/index.css" /></head><body><div class="container text-center"><div class="row"><div><div class="rotation" style="position: relative; width: 100%;"><img src="data:images/1.png" style="display: block; width: 100%;"><img src="data:images/2.png" style="display: none; width: 100%;"><img src="data:images/3.png" style="display: none; width: 100%;"><img src="data:images/4.png" style="display: none; width: 100%;"><img src="data:images/5.png" style="display: none; width: 100%;"><img src="data:images/6.png" style="display: none; width: 100%;"><img src="data:images/7.png" style="display: none; width: 100%;"><img src="data:images/8.png" style="display: none; width: 100%;"><img src="data:images/9.png" style="display: none; width: 100%;"><img src="data:images/10.png" style="display: none; width: 100%;"><img src="data:images/11.png" style="display: none; width: 100%;"><img src="data:images/12.png" style="display: none; width: 100%;"><img src="data:images/13.png" style="display: none; width: 100%;"><img src="data:images/14.png" style="display: none; width: 100%;"><img src="data:images/15.png" style="display: none; width: 100%;"><img src="data:images/16.png" style="display: none; width: 100%;"><img src="data:images/17.png" style="display: none; width: 100%;"><img src="data:images/18.png" style="display: none; width: 100%;"><img src="data:images/19.png" style="display: none; width: 100%;"><img src="data:images/20.png" style="display: none; width: 100%;"><img src="data:images/21.png" style="display: none; width: 100%;"><img src="data:images/22.png" style="display: none; width: 100%;"><img src="data:images/23.png" style="display: none; width: 100%;"><img src="data:images/24.png" style="display: none; width: 100%;"><img src="data:images/25.png" style="display: none; width: 100%;"><img src="data:images/26.png" style="display: none; width: 100%;"><img src="data:images/27.png" style="display: none; width: 100%;"><img src="data:images/28.png" style="display: none; width: 100%;"><img src="data:images/29.png" style="display: none; width: 100%;"><img src="data:images/30.png" style="display: none; width: 100%;"><img src="data:images/31.png" style="display: none; width: 100%;"><img src="data:images/32.png" style="display: none; width: 100%;"><img src="data:images/33.png" style="display: none; width: 100%;"><img src="data:images/34.png" style="display: none; width: 100%;"><img src="data:images/35.png" style="display: none; width: 100%;"><img src="data:images/36.png" style="display: none; width: 100%;"><img src="data:images/37.png" style="display: none; width: 100%;"><img src="data:images/38.png" style="display: none; width: 100%;"><img src="data:images/39.png" style="display: none; width: 100%;"><img src="data:images/40.png" style="display: none; width: 100%;"><img src="data:images/41.png" style="display: none; width: 100%;"><img src="data:images/42.png" style="display: none; width: 100%;"><img src="data:images/43.png" style="display: none; width: 100%;"><img src="data:images/44.png" style="display: none; width: 100%;"><img src="data:images/45.png" style="display: none; width: 100%;"><img src="data:images/46.png" style="display: none; width: 100%;"><img src="data:images/47.png" style="display: none; width: 100%;"><img src="data:images/48.png" style="display: none; width: 100%;"><img src="data:images/49.png" style="display: none; width: 100%;"><img src="data:images/50.png" style="display: none; width: 100%;"><img src="data:images/51.png" style="display: none; width: 100%;"><img src="data:images/52.png" style="display: none; width: 100%;"><img src="data:images/53.png" style="display: none; width: 100%;"><img src="data:images/54.png" style="display: none; width: 100%;"><img src="data:images/55.png" style="display: none; width: 100%;"><img src="data:images/56.png" style="display: none; width: 100%;"><img src="data:images/57.png" style="display: none; width: 100%;"><img src="data:images/58.png" style="display: none; width: 100%;"><img src="data:images/59.png" style="display: none; width: 100%;"><img src="data:images/60.png" style="display: none; width: 100%;"><img src="data:images/61.png" style="display: none; width: 100%;"><img src="data:images/62.png" style="display: none; width: 100%;"><img src="data:images/63.png" style="display: none; width: 100%;"><img src="data:images/64.png" style="display: none; width: 100%;"><img src="data:images/65.png" style="display: none; width: 100%;"><img src="data:images/66.png" style="display: none; width: 100%;"><img src="data:images/67.png" style="display: none; width: 100%;"><img src="data:images/68.png" style="display: none; width: 100%;"><img src="data:images/69.png" style="display: none; width: 100%;"><img src="data:images/70.png" style="display: none; width: 100%;"><img src="data:images/71.png" style="display: none; width: 100%;"><img src="data:images/72.png" style="display: none; width: 100%;"></div></div></div></div><script src="js/circlr.js"></script></body>
</html>

补充两种方法：
1、使用JavaScript（Java、Python等语言）写一个字符串循环
2、使用bat批处理命令
3、使用HBuilderX也有像VS Code一样的快速生成语法，只是在VS Code中使用Enter键生成，而在HBuilder X中使用Tab键生成

批量替换字符串，将其中的数字递增（两种方法）和circlr.js插件的使用相关推荐

Python把嵌套的字符串列表转换为整数列表的两种方法
假设有如下嵌套的字符串列表: testMatrix = [['1', '2', '3'], ['4', '5', '6'], ['7', '8' ...
(方法总结)Python 一行代码提取字符串每个单词首字母的两种方法
第一种方法: 使用知识点: 列表推导式切片 split() 方法实现案例: In [1]: a_str = "I Love Python" In [2]: [i[0] for ...
WPF TextBox限制只能输入数字的两种方法
文本框中只能输入数字,一个常见的功能喽,今天就来看看如何实现它~ 下面就看看代码思路都写在xaml里面了, MainWindow.xaml: <Window x:Class="wpf ...
JS字符串中的第一个字母大写（两种方法）
如何将字符串中的第一个字母大写一个非常常见的操作是将字符串的第一个字母大写.虽然许多编程语言都有一种本地方法来实现这一点,但 JS 需要做一些工作. <!DOCTYPE HTML> &l ...
输入字符串，逆序输出（两种方法）
问题描述从键盘上输入一组字符串,实现逆序输出. 解题思路方法一:输出的时候从(n-1)的数据往前依次输出. 方法二:假设输入n个字符,字符串默认末尾补上' \0 ',将第0个字符和第(n-1)个字 ...
学习笔记：获取字符串中数字的两种方法
方法一:正则表达式法 var s = "123半234月789谈000"; a = s.replace(/[^0-9]/ig, ""); console.log ...
判断字符串中是否为数字的三种方法
//1用JAVA自带的函数 public static boolean isNumeric(String str){for (int i = str.length();--i>=0;){ if ...
java字符转为数字_Java 判断字符串能否转化为数字的三种方法
linux shell 常用指令 1. man 对你熟悉或不熟悉的命令提供帮助解释 eg:man ls 就可以查看ls相关的用法注:按q键或者ctrl+c退出,在linux下可以使用ctrl+c终止 ...
Java 正则中判断字符串是否为数字的两种方法
方法1: public static boolean isNumber(String str){Pattern pattern = Pattern.compile("\\d+"); ...
java indexof 子字符串_Java中字符串中子串的查找共有四种方法(indexof())
Java中字符串中子串的查找共有四种方法(indexof()) Java中字符串中子串的查找共有四种方法,如下: 1.int indexOf(String str) :返回第一次出现的指定子字符串在此 ...

批量替换字符串，将其中的数字递增（两种方法）和circlr.js插件的使用

批量替换字符串，将其中的数字递增（两种方法）和circlr.js插件的使用相关推荐

最新文章

热门文章