Вход

Просмотр полной версии : Вставить инпут в начало формы с помощью js


NovichokJS
07.07.2022, 14:43
Помогите плиз. Есть html:

<body>
<form class="login-form">
<input type="text" name="password" />
</form>
<script src="index.js" type="module"></script>
</body>

Мне нужно перед существующим инпутом вставить инпут с типом логин. Делаю таким образом и вставляется туда это поле как строка:

function finishForm() {
const form = document.querySelector(".login-form");
const loginField = '<input type="text" name="login" />';
form.prepend(loginField);
return form;
}

finishForm();

Как сделать чтобы поле инпут логин вставлялось без ковычек?

NovichokJS
07.07.2022, 15:02
разобрался:
function finishForm() {
const form = document.querySelector(".login-form");
const inputElem = document.createElement("input");
inputElem.setAttribute("type", "text");
inputElem.setAttribute("name", "login");
form.prepend(inputElem);
return form;
}
Так корректно сделал?

рони
07.07.2022, 15:09
Как сделать чтобы поле инпут логин вставлялось без ковычек?
https://learn.javascript.ru/modifying-document#insertadjacenthtml-text-element

NovichokJS
07.07.2022, 15:15
https://learn.javascript.ru/modifying-document#insertadjacenthtml-text-element

ясно, а как поменять тип инпута для поля ввода пароля (чтобы вместо input type="text" было input type="password" )?
Вот таким образом не проходит:
let elemPaasw = document.querySelector(".login-form: nth-child(2)");
elemPaasw.setAttribute("type", "password");
return form;

рони
07.07.2022, 15:17
NovichokJS,
в данном случае можно так
//inputElem.setAttribute("type", "text");
//inputElem.setAttribute("name", "login");
inputElem.name = "login";
будет тоже самое.

рони
07.07.2022, 15:18
Вот таким образом не проходит:
учить css селекторы

NovichokJS
07.07.2022, 15:27
учить css селекторы

понял, уже выучил:

let elemPaasw = document.querySelector("input:nth-child(2)");
elemPaasw.setAttribute("type", "password");

рони
07.07.2022, 15:32
понял, уже выучил:

а исправить ошибку? пост #4