Что такое innerHTML на входных элементах?

Я просто пытаюсь сделать это с консоли Chrome в Википедии. Я помещаю свой курсор в строку поиска, а затем пытаюсь сделать document.activeElement.innerHTML += "some text", но это не сработает. Я googled вокруг и посмотрел на другие свойства и атрибуты и не мог понять, что я делаю неправильно.

Селектор activeElement отлично работает, он выбирает правильный элемент.

Изменить. Я просто нашел, что это свойство value. Поэтому я хотел бы изменить то, что я прошу. Почему не меняется innerHTML на входные элементы? Почему у них есть это свойство, если я ничего не могу с этим сделать?

Ответы

Ответ 1

Настройка value обычно используется для элементов ввода/формы. innerHTML обычно используется для div, span, td и подобных элементов.

value применяется только к объектам, у которых есть атрибут value (обычно, элементы управления формой).

innerHTML применяется к каждому объекту, который может содержать HTML (divs, spans, но многие другие, а также элементы управления формой).

Они не эквивалентны или не заменяемы. Зависит от того, чего вы пытаетесь достичь.

Ответ 2

Сначала поймите, где использовать что.

<input type="text" value="23" id="age">

Здесь теперь

var ageElem=document.getElementById('age');

Итак, на этом ageElem у вас может быть много чего, что содержит этот элемент. Таким образом, вы можете использовать его атрибуты value, type и т.д. Но не могу использовать innerHTML, потому что мы ничего не пишем между входным тегом

  <button id='ageButton'>Display Age</button>

Итак, здесь Display Age является содержимым innerHTML, поскольку оно написано внутри кнопки тега HTML.

Ответ 3

Использование innerHTML во входном теге просто приведет к:

<input name="button" value="Click" ... > InnerHTML Goes Here </input>

Но поскольку тегу ввода не нужен закрытый тег, он получит reset:

<input name="button" value="Click" ... />

Поэтому, скорее всего, ваши браузеры применяют изменения и сразу же перезагружают его.

Ответ 4

Вы имеете в виду что-то вроде этого:

$('.activeElement').val('Some text');

Ответ 5

Каждый элемент HTML имеет свойство innerHTML, которое определяет как HTML кода и текста, который возникает между открытием этого элемента и закрывающий тег. Изменив элемент innerHTML после некоторого пользователя вы можете сделать гораздо больше интерактивных страниц.

JScript

<script type="text/javascript">
function changeText(){
    document.getElementById('boldStuff').innerHTML = 'Fred Flinstone';
}
</script>

HTML

<p>Welcome to Qaru <b id='boldStuff'>dude</b> </p> 
<input type='button' onclick='changeText()' value='Change Text'/>

В приведенном выше примере b тегом является innerHTML, а dude - его значение, поэтому для изменения этих значений мы написали функцию в JScript

Ответ 6

innerHTML - это свойство DOM для вставки содержимого в указанный идентификатор элемента. Он используется в Javascript для управления DOM.

Например: document.getElementById( "example" ). innerHTML = "моя строка";

В этом примере используется метод "найти" элемент HTML (с id = "example" ) и изменяет содержимое элемента (innerHTML) на "my string":

HTML Изменение

Javascript

function change(){
  document.getElementById("example").innerHTML = "Hello, World!"
}

После нажатия кнопки "Привет, мир! появится, потому что innerHTML вставляет значение (в данном случае Hello, World!) между открывающим тегом и закрывающим тегом с идентификатором "example".

Итак, если вы проверите элемент после нажатия кнопки, вы увидите следующий код:

<div id="example">Hello, World!</div>

Thats all

Ответ 7

innerHTML - это свойство DOM для вставки содержимого в указанный идентификатор элемента. Он используется в Javascript для манипулирования DOM.

Пример.

HTML

+ Изменить

Javascript

function FunctionName(){
  document.getElementById("example").innerHTML = "Hello, Kennedy!"
}

На кнопку Нажмите, Привет, Кеннеди! появится, потому что innerHTML вставит значение (в данном случае Hello, Kennedy!) между открывающим и закрывающим тегами с идентификатором "example".

Итак, осмотрев элемент после нажатия кнопки, вы увидите следующий код:

<div id="example">Hello, Kennedy!</div>

Ответ 8

использование

document.querySelector('input').defaultValue = "sometext"

Использование innerHTML не работает с элементами ввода, а также с textContent

Ответ 9

<input id="input" type="number">

document.getElementById("input").addEventListener("change", GetData);

function GetData () {
  var data = document.getElementById("input").value;
  console.log(data);
  function ModifyData () {
    document.getElementById("input").value = data + "69";
  };
  ModifyData();
};

Мои комментарии: Здесь поле ввода работает как ввод и отображение при изменении .value

Ответ 10

var lat = document.getElementById("lat").value;
lat.value = position.coords.latitude;

<input type="text" id="long" class="form-control" placeholder="Longitude">
<button onclick="getLocation()" class="btn btn-default">Get Data</button>