如何在JavaScript全局作用域的函数中访问input输入值

你的代码不存在作用域访问问题，全局声明的value1本身可以被全局函数display正常读取。你无法拿到预期值的核心原因是你在页面初始化阶段就提前读取了input的value值，此时用户还未完成输入，后续input内容更新后，已经赋值完成的value1变量不会自动同步最新内容。

• 方案1：在调用函数时读取input实时值
  把获取value的逻辑移入display函数内部，每次调用都主动拉取最新的输入内容，避免提前取值导致数据过期：

// 提前缓存DOM元素，避免重复查询DOM
const input1 = document.getElementById('input1');
function display(){
  const value1 = input1.value;
  console.log(value1);
}

display() // 输出当前input的实时值

• 方案2：监听输入事件同步全局变量
  如果有多处逻辑需要用到这个输入值，不想每次都查询DOM，可以给input绑定输入监听事件，内容变化时自动更新全局变量：

let value1 = '';
const input1 = document.getElementById('input1');
// 监听输入动作，实时同步最新值到全局变量
input1.addEventListener('input', () => {
  value1 = input1.value;
})

function display(){
  console.log(value1);
}

display() // 输出全局存储的最新输入值

内容的提问来源于stack exchange，提问作者brianlay