现在数据渲染了12345678然后举例1身上有一左一右按钮点击向右的时候1和2互换位置,不发请求,就js操作。
<!--
* @Author: your name
* @Date: 2021-12-30 16:59:23
* @LastEditTime: 2022-03-08 20:47:57
* @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /未命名文件夹/123.html
-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<div class="box"></div>
<button class="left">left</button>
<button class="right">right</button>
<script>
window.onload = function () {
var num = 0;
var a = "123456789";
document.querySelector(".box").innerHTML = a;
function change(arr, k, j) {
var c = arr[k];
arr[k] = arr[j];
arr[j] = c;
a = arr.join("");
document.querySelector(".box").innerHTML = arr.join("");
}
document.querySelector(".left").onclick = function () {
if (num == 0) return;
change(a.split(""), num, num - 1);
num--;
};
document.querySelector(".right").onclick = function () {
if (num == 8) return;
change(a.split(""), num, num + 1);
num++;
};
};
</script>
</body>
</html>
变量试试