Gaara_sand1,
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Перестановки.</title>
<link rel="stylesheet" href="style.css" >
</head>
<body>
<h1>Перестановки.</h1>
<div>
<input id="b1" name="input" type="button" value="Все перестановки из" >
<input id="number" style="width: 15px;" name="input" type="text" maxlength="1" value="4"> элементов.
</div>
<div id="res" style="text-align: left"></div>
<script>
function perms(xs){
var r=[];
for (var i=0;i<xs.length;i++){
var xs_ = xs.slice(),
x = xs_.splice(i, 1),
ps = xs_.length ? perms(xs_) : [[]];
r.push(...ps.map(p=>x.concat(p)));
}
return r;
}
b1.addEventListener("click" , function(event) {
var length = number.value = +number.value||0;
var arr = Array.from({length}, (_, i) => ++i);
arr = perms(arr);
res.innerHTML = `${arr.join("<br>")}<br>Всего: ${arr.length}`
});
</script>
</body>
</html>