input元素不会自动获取焦点代码如下：
<div><h2>js创建input元素并自动聚焦</h2></div><script>let myButton = document.createElement('button');myButton.innerText = ' 点击我';document.body.append(myButton);myButton.onmousedown = () => {let myInput = document.createElement('input');myInput.placeholder = '手机号';document.body.appendChild(myInput);myInput.focus();};</script>
点击按钮后，生成的input框并不会获取焦点，如图：
解决方案
1、使用setTimeout，代码如下
<div><h2>js创建input元素并自动聚焦</h2></div><script>let myButton = document.createElement('button');myButton.innerText = ' 点击我';document.body.append(myButton);myButton.onmousedown = () => {let myInput = document.createElement('input');myInput.placeholder = '手机号';document.body.appendChild(myInput);setTimeout(() => {myInput.focus();}, 0);};</script>
2、把onmousedown改成onclick，代码如下：
<div><h2>js创建input元素并自动聚焦</h2></div><script>let myButton = document.createElement('button');myButton.innerText = ' 点击我';document.body.append(myButton);myButton.onclick = () => {let myInput = document.createElement('input');myInput.placeholder = '手机号';document.body.appendChild(myInput);myInput.focus();};
当使用onmousedown时，默认触发的Event:foucs事件是发生在完成onmousedown回调函数之后，故input框无法获取焦点
当使用onclick时，默认触发的Event:foucs事件是发生在完成onclick回调函数之前，故input框可以获取焦点
过程如下图：
onmousedown过程图
onclick过程图
验证触发默认事件代码如下：
<div><h2>js创建input元素并自动聚焦</h2></div><script>let myButton = document.createElement('button');myButton.innerText = ' 点击我';document.body.append(myButton);// 默认触发该事件myButton.onfocus = () => {console.log('触发了onfocus事件');};myButton.onmousedown = () => {let myInput = document.createElement('input');myInput.placeholder = '手机号';document.body.appendChild(myInput);myInput.focus();};
打印的log如图：
3、阻止默认事件发生，代码如下：
只需要阻止Event:foucs事件的发生，就可以自动获取焦点。
<div><h2>js创建input元素并自动聚焦</h2></div><script>let myButton = document.createElement('button');myButton.innerText = ' 点击我';document.body.append(myButton);myButton.onmousedown = event => {event.preventDefault();let myInput = document.createElement('input');myInput.placeholder = '手机号';document.body.appendChild(myInput);myInput.focus();};
使用上述任意一种解决方案，点击按钮后都可以获取焦点，效果图如下：
ps： 如有不足，请指点，谢谢！
