Вставка var элемента внутрь div

Question

Есть поле для ввода текста и есть div элемент, куда этот текст должен встать.

Пока есть такой код:

<div id="textin"><div>
<input type="text" id="txt"/>
<input type="button" id="btn" value="Ввод">

<script>

function someFunc(){
document.write(document.getElementById("txt").value);
}
document.getElementById("btn").onclick = someFunc;

</script>

Вместо document.write нужно задать var и вставить его в div. И ещё он должен записаться в локал стор, чтобы не слетел после перезапуска.

Вроде это не сложно делается, просто я js только начал, а идею реализовать хочется.

И ещё, не появятся же проблемы, если поле ввода находятся на одной странице, а див на другой, но обе страницы подключены к одному .js файлу?

Answer 1

Это то, как поместить текст в див.

function someFunc(){
  document.getElementById("textin").textContent = document.getElementById("txt").value;
  localStorage.setItem('text', document.getElementById("txt").value);
}

document.getElementById("btn").onclick = someFunc;

<div id="textin"></div>
<input type="text" id="txt"/>
<input type="button" id="btn" value="Ввод">

А если див - это другая страница, то из локалСториджа просто забиарть каждый раз. Как-то так

if(document.getElementById('textin') && localStorage.getItem('text')) {
  document.getElementById('textin').textContent = localStorage.getItem('text');
}

<div id="textin"></div>

то есть проверяем сначала есть ли в доме нужный нам элемент. И если есть, кладём в него значение из хранилища. Только я не помню, что вернёт гетАйтем, если там ничего нет. Может нужно и его проверить.

UPD: localStorage.getItem('text'); вернёт null, если ничего нет. То есть его тоже надо проверить.

БЛОГ НА HUSL

Вставка var элемента внутрь div

Ответы (1 шт):