<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
</head>
<body>
<div class="container ">
<div class="form-group">
<label for="cadena">cadena original:</label>
<input type="text" class="form-control" id="cadena">
</div>
<div class="form-group">
<label for="cadena">tamaño:</label>
<input type="text" class="form-control" id="tamany">
</div>
<h1 id="posicion"></h1>
<button type="button" class="btn btn-success" onclick="buscar2()">Buscar</button>
<script src="js/test.js"></script>
</form>
</div>
</body>
</html>
function buscar () {
let cadena = document.getElementById('cadena').value
const tamany = parseFloat(document.getElementById('tamany').value)
// Vacío el HTML para poner nuevos valores
document.getElementById('posicion').innerHTML = ''
// Si la cadena no está vacía
while (cadena.length > 0) {
// Pon en el html un fragmento de la cadena de longitud 'tamany' y una coma
document.getElementById('posicion').innerHTML += cadena.substr(0, tamany) + ', '
// Quítale a la cadena el fragmento que he puesto en el HTML
cadena = cadena.substr(tamany)
}
// Le quito la coma final
document.getElementById('posicion').innerHTML = document.getElementById('posicion').innerHTML.slice(0, -2)
}
function buscar2 () {
const cadena = document.getElementById('cadena').value
const tamany = parseFloat(document.getElementById('tamany').value)
// Vacío el HTML para poner nuevos valores
document.getElementById('posicion').innerHTML = ''
// Como sé que tengo que empezar en el 0 y acabar en la longitud de la cadena
// Puedo utilizar un for
for (let i = 0; i < cadena.length; i += tamany) {
document.getElementById('posicion').innerHTML += cadena.substr(i, tamany) + ', '
}
// Le quito la coma final
document.getElementById('posicion').innerHTML = document.getElementById('posicion').innerHTML.slice(0, -2)
}
