如何从javascript输入中获取值？

Question

如何从javascript中的输入元素中获取值？ 由于某种原因，我的代码未执行。 这是我的HTML代码：

   <section id ="my-life" style="margin-left:39em;">

   <input class="jenny" placeholder="Your First Name"/> <br /><br />

   <button id="get">Subscribe</button>

   <br /><br />

  <div id ="whitelion">Thank You!</div>



    This is my javascript code:

   function buttonClicked() {
   var Niche = document.getElementsByClassName("jenny");
   var results = document.getElementById("whitelion");


   results.innerHTML = "Hello" + Niche[0].value;

}

Answer 1

 function buttonClicked() { var Niche = document.getElementsByClassName("jenny"); var results = document.getElementById("whitelion"); results.innerHTML = "Hello " + Niche[0].value; } 

 <input class="jenny" placeholder="Your First Name"/> <br /><br /> <button onclick='buttonClicked();'>Subscribe</button> <br /><br /> <div id ="whitelion">Thank You!</div> 

Answer 2

  <section id ="my-life" style="margin-left:39em;">

   <input class="jenny" placeholder="Your First Name"/> <br /><br />

   <button id="get">Subscribe</button>

   <br /><br />

  <div id ="whitelion">Thank You!</div>



<script>
   function buttonClicked() {
     var Niche = document.getElementsByClassName("jenny");
     var results = document.getElementById("whitelion");

     results.innerHTML = "Hello" + Niche[0].value;
   }

  document.getElementById('get').onclick = buttonClicked;

</script>

Answer 3

我在编辑器上尝试了您的代码。 工作正常。 但是您必须在<script>元素中包含JS代码。 并将其放在文档的底部。

 function buttonClicked() { var Niche = document.getElementsByClassName("jenny"); var results = document.getElementById("whitelion"); results.innerHTML = "Hello " + Niche[0].value; } 

 <section id ="my-life"> <input class="jenny" placeholder="Your First Name"/> <br /><br /> <button id="get" onclick="buttonClicked()">Subscribe</button> <br /><br /> <div id ="whitelion">Thank You!</div> <br/> </section>