ForEach подставляет одно значение в инпуты, почему?
Почему forEach внутри for in подставляет в инпуты только одно значение а не все по порядку?
const href = "http://redtrack.io/?utm_source=google&utm_medium=cpc&utm_campaign={network}&utm_content={creative}&utm_term={keyword}",
url = new URL(href),
input = document.querySelectorAll(".input");
let searchString;
if (url.search.includes("&")) {
searchString = url.search.slice(1).split("&");
}
const searchStringToObj = (href) => {
return searchString.reduce((accum, item) => {
item = item.split("=");
accum[item[0]] = item[1];
return accum;
}, {});
};
const res = searchStringToObj(searchString);
for (let key in res) {
input.forEach((item, i) => {
const g = res[key];
input[i].value = g;
});
}
body {
font-family: sans-serif;
}
.form {
display: flex;
flex-direction: column;
max-width: 250px;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Test</title>
</head>
<body>
<div class="test">
<h2>Test UTM</h2>
<form class="form">
<label for="utm_source">utm_source</label>
<input class="input" id="utm_source" type="text" />
<label for="utm_medium">utm_medium</label>
<input class="input" id="utm_medium" type="text" />
<label for="ad_group_name">ad_group_name</label>
<input class="input" id="ad_group_name" type="text" />
<label for="ad_group_name2">ad_group_name2</label>
<input class="input" id="ad_group_name2" type="text" />
<label for="ad_group_name3">ad_group_name3</label>
<input class="input" id="ad_group_name3" type="text" />
</form>
</div>
<script src="src/index.js"></script>
</body>
</html>