Как поместить входное значение (тип = текст) в HTML как результат функции JavaScript
Мне интересно, как поместить входное значение (вход = текст) в HTML как результат функции JS.
В настоящее время я использую эту функцию JavaScript;
function maketeststring(length) {
let result = '';
const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
const charactersLength = characters.length;
let counter = 0;
while (counter < length) {
result += characters.charAt(Math.floor(Math.random() * charactersLength));
counter += 1;
}
return result;
}
console.info(maketeststring(16));
Это мой входной код в HTML;<input class = "test_string" type = "text" id = "teststring" readonly;>
Результат функции maketeststring всегда обновляется, когда пользователь обновляет веб-сайт (например, когда вы открываете веб-сайт в первый раз, это будет «IR5xOxAq30ZcOGku», когда вы обновляете веб-сайт, он будет перегенерирован в «Nnd2QlgSVFkjgthY». Я хочу, чтобы мое входное значение изменилось всякий раз, когда пользователи обновляют сайт. Заранее спасибо!
Сейчас он работает отлично, но можете ли вы помочь мне отобразить его и в консоли? Я попробовал добавить console.info(maketeststring(16)) под строку document.getElementByID('teststring').value = maketeststring(16). На моем веб-сайте отображается одна строка, но в журнале консоли строка не совпадает. @Годот
Я изменил свой комментарий на ответ, чтобы показать, как отображать его на входе И в консоли.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Вы можете получить и установить значение элемента ввода через свойство value. В твоем случае:
document.getElementById("teststring").value = "new value";
Подробнее об элементе ввода можно прочитать в этом документе: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input
Отвечаю, так как у вас есть дополнительные требования
Если вы хотите отобразить строку в поле И в консоли, то вам необходимо сохранить результат, так как каждый раз при вызове функции вы получаете новую строку
Я заключаю DOMContentLoaded, чтобы скрипт можно было разместить в заголовке перед элементами HTML.
function maketeststring(length) {
let result = '';
const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
const charactersLength = characters.length;
let counter = 0;
while (counter < length) {
result += characters.charAt(Math.floor(Math.random() * charactersLength));
counter += 1;
}
return result;
}
document.addEventListener('DOMContentLoaded', () => { // when page elements are available
const saveString = maketeststring(16); // save the result
console.info(saveString); // show it in console
document.getElementById('teststring').value = saveString;
});<input class = "test_string" type = "text" id = "teststring" readonly;>
ты имеешь в виду поменять
console.info(maketeststring(16));наdocument.getElementById('teststring').value = maketeststring(16);?