Вытягивание ввода с использованием Javascript и вставка в HTML

Я хочу взять значение из строки поиска с помощью JS, а затем поместить его в HTML.

function pullValue() {
var search = document.getElementById("search-bar")
}

Мой вопрос: как вы используете эти данные, чтобы заполнить это:

<h3>
 *value from the function above"
 </h3>
2 ответа

Обычно вы используете пару небольших функций, которые используются главной функцией для выполнения задания, например

// Set the text content of an element
// Some browsers support only textContent, some only innerText, some both
// so cater for them all
function setText(el, s) {
 if (typeof el.textContent == 'string') {
 el.textContent = s;
 } else if (typeof el.innerText == 'string') {
 el.innerText = s;
 }
}

// Given an element ID, set the text to text
function update(id, text) {
 var el = document.getElementById(id);
 if (el) {
 setText(el, text);
 }
}

и связанный с ним HTML может быть:


Вы можете сделать это довольно легко. Установите переменную в value ввода, затем установите innerHTML или value другого input/div с переменной. Вам также потребуется прослушиватель событий либо изменения ввода, либо нажатия кнопки.

Вот демонстрация: http://codepen.io/lachlanjc/pen/ZYBrqg?editors=101

licensed under cc by-sa 3.0 with attribution.