如何在javascript中选择两个带有id的元素？ [复制]答案

【问题标题】：How can i select two elements with id in javascript? [duplicate]如何在javascript中选择两个带有id的元素？ [复制]
【发布时间】：2020-12-17 12:33:31
【问题描述】：

有没有办法合并javascript的元素来减少代码大小？

<form>
   <input id="input1" type="text"/>
   <input id="input2" type="text"/>
</form>

//javascrypt
document.getElementById("input1").onkeypress = function(e) {
   var chr = String.fromCharCode(e.which);
   if ("1234567890qwertyuioplkjhgfdsazxcvbnmQWERTYUIOPLKJHGFDSAZXCVBNM".indexOf(chr) < 0) return false;
};
document.getElementById("input2").onkeypress = function(e) {
   var chr = String.fromCharCode(e.which);
   if ("1234567890qwertyuioplkjhgfdsazxcvbnmQWERTYUIOPLKJHGFDSAZXCVBNM".indexOf(chr) < 0) return false;
};

【问题讨论】：

给函数命名并重用它？
你可以选择“class”而不是“id”。
document.querySelectorAll("#input1, #input2") 会给你一个包含它们的NodeList。但请注意，它是一个 list，因此您必须遍历它才能分配该处理程序 (more here)。

标签： javascript html

【解决方案1】：

是的，您可以通过创建事件处理程序来减小大小，并在两种情况下都使用该事件处理程序，

<form>
   <input id="input1" type="text"/>
   <input id="input2" type="text"/>
</form>

//javascrypt

const keyPressHandler = (e) => {
   var chr = String.fromCharCode(e.which);
   if ("1234567890qwertyuioplkjhgfdsazxcvbnmQWERTYUIOPLKJHGFDSAZXCVBNM".indexOf(chr) < 0) return false;
};

document.getElementById("input1").onkeypress = keyPressHandler;
document.getElementById("input2").onkeypress = keyPressHandler;

【讨论】：