我将如何访问文本字段以操作其中的信息？

Question

我正在尝试使用 id="first" 访问文本字段，以便我可以读取其中的任何信息，甚至可以通过 java 脚本将信息写入其中。

这是我尝试的最后一种方法，我知道这行不通，但我的大脑很累，我已经用了好几天了。我是 Java 脚本的新手，我只是把它当作一个实验来玩，但现在它让我发疯了。

<script>

 { var targetDiv = document.getElementById("popover-content- 

  right").getElementsByClassName("well popover- 

  right").getElementById("edit- 

  user").getElementById("first")[0];

  targetDiv.textContent = "Hello world!";

}

</script>

我尝试了其他几种方法，但没有奏效。

<div id="popover-content-right" class="well popover-right" data- 

dicomgrid-active-popover="create" style="top: 133px; width: 480px; 

display: 

block;"> 

<form id="edit-user" onsubmit="return saveForm(this)">

<div class="form-inline">

  <div class="form-group">

    <label data-i18n-token="global:first-name">First name</label><br>

    <input id="first" data-validate="required" class="form-control">

    <span class="help-inline small"></span>

  </div>

  </div>

  </form>

  </div>

我希望当我向显示在那里的文本字段写一些东西时，例如“Hello world”，但现在我什么也没得到，它只是保持空白。

Answer 1

只是一个简单的document.getElementById应该返回您所需的元素，并.value让您访问元素的值，就像普通变量一样。onload = function() {&nbsp; var textField = document.getElementById("first");&nbsp; var value = textField.value; //read&nbsp; textField.value = "something"; //write}<div id="popover-content-right" class="well popover-right" data-&nbsp;dicomgrid-active-popover="create" style="top: 133px; width: 480px;&nbsp;display:&nbsp;block;">&nbsp;<form id="edit-user" onsubmit="return saveForm(this)"><div class="form-inline">&nbsp; <div class="form-group">&nbsp; &nbsp; <label data-i18n-token="global:first-name">First name</label><br>&nbsp; &nbsp; <input id="first" data-validate="required" class="form-control">&nbsp; &nbsp; <span class="help-inline small"></span>&nbsp; </div>&nbsp; </div>&nbsp; </form>&nbsp; </div>