无法设置元素的值

Question

在函数内创建 HTML 输入元素。调用该函数后，元素显示在该位置上，我可以输入它，但无法通过脚本访问它。

经过研究，我添加了一个检查该元素是否存在，如果存在，我仍然无法在脚本中更改其值...我可以使用 document.getElementById("txtSearchBelow").value = 'access me 更改控制台中的值'

<div id = "searchResults"></div>

document.getElementById("searchResults").innerHTML = '<input id="txtSearchBelow"class="form-control" type="text" placeholder="Search..">'+'<br>';

var inputBelow = document.getElementById("txtSearchBelow");

console.log(inputBelow);

console.log('until here it seems fine.');

var element = document.getElementById("txtSearchBelow");

 //If it isn't "undefined" and it isn't "null", then it exists.

if(typeof(element) != 'undefined' && element != null){

    alert('Element exists!');

// this here doesnt work. why not?

    document.getElementById("txtSearchBelow").value = 'eyyy please access me'; 

} else{

    alert('Element does not exist!');

}

我怎么可以通过控制台更改值，但不能在脚本中更改值？

编辑：

它的工作有延迟！太感谢了 ！

Answer 1

我想说这是因为它创建元素的渲染时间比它后面的逻辑要长。意思是你的 var element = document.getElementById("txtSearchBelow");&nbsp;在浏览器识别该元素之前执行。在调用 document.getElementById("txtSearchBelow") 之前放入延迟计时器

Answer 2

它工作得很好，我没有收到你的抱怨......document.getElementById("searchResults").innerHTML = '<input id="txtSearchBelow"class="form-control" type="text" placeholder="Search..">'+'<br>';var inputBelow = document.getElementById("txtSearchBelow");console.log(inputBelow);console.log('until here it seems fine.');var element = document.getElementById("txtSearchBelow");// If it isn't "undefined" and it isn't "null", then it exists.if (typeof(element) != 'undefined' && element != null) {&nbsp; &nbsp; console.log('Element exists!');&nbsp; &nbsp; // This line works for me...!&nbsp; &nbsp; document.getElementById("txtSearchBelow").value = 'eyyy please access me';&nbsp;} else {&nbsp; &nbsp; console.log('Element does not exist!');}<div id="searchResults"></div>

Answer 3

也许是浏览器的问题？计算机系统和加载延迟是可能的。我可以运行它