无法获取此输入的值答案

【问题标题】：can't get the value of this input无法获取此输入的值
【发布时间】：2021-01-14 14:05:59
【问题描述】：

我正在尝试获取输入的值，但它说的是鼠标事件。如果我只调用此函数而不是 eventListener ，则表示未定义。

let btn = document.getElementById('btn');
let pra = document.getElementById('inp1').value;
let cont = document.getElementById('container')


function execute(pra) {

    let newElemet = document.createElement('p');
    newElemet.innerHTML = pra;
    cont.appendChild(newElemet)

}
btn.addEventListener('click', execute)

<div id="container">
      <input id="inp1" type="text">
      <button id="btn">Add</button>
    </div>

【问题讨论】：

function execute(pra) { 这个pra 不是全局的pra 变量。完全删除pra 并更改为newElemet.innerHTML = document.getElementById('inp1').value;
是的，我已经做到了，它正在工作

标签： javascript function dom event-handling

【解决方案1】：

两个问题。

事件处理程序的pra 参数表示事件（如您所说的鼠标事件）并掩盖了pra 全局变量。您可以删除参数以摆脱阴影。
全局pra 变量包含加载脚本时存在的值（空）。您需要使pra 代表输入元素。

let btn = document.getElementById('btn');
let pra = document.getElementById('inp1');
let cont = document.getElementById('container')


function execute() {

    let newElemet = document.createElement('p');
    newElemet.innerHTML = pra.value;
    cont.appendChild(newElemet)

}
btn.addEventListener('click', execute)

<div id="container">
      <input id="inp1" type="text">
      <button id="btn">Add</button>
    </div>

【讨论】：