Javascript 如何通过HTMLDOM向元素添加oninput属性？

我目前正在使用JavaScript构建一个HTML侧边栏。现在我正试图在侧边栏中添加一个搜索字段

var searchField = document.createElement("input");
    searchField.placeholder = "Search";
    searchField.type = "text";
    searchField.id = "search-field";
    searchField.className = "txtclring";
    searchField.oninput = "search();";
    searchContainer.appendChild(searchField);

我的问题是oninput属性。所有其他属性都会显示在文档中，但oninput不会显示为属性。此构造的代码在Chrome DevTools中如下所示：

<input placeholder="Search" type="text" id="search-field" class="txtclring">

---

如何使oninput属性显示并工作？提前谢谢

内部事件属性（如

oninput

和

onclick

）的值必须是函数，而不是字符串

searchField.oninput = search;

---

如果要传递字符串，则需要设置属性

searchField.setAttribute("oninput", "search();");

…但不要。这是变相的

eval

，在范围内玩可怕的游戏，同时使调试变得困难

---

内部事件属性已经够糟糕的了。最好采用现代方法

addEventListener

于90年代引入，并在IE9问世时获得了广泛的浏览器支持

searchField.addEventListener("input", search);

---

你在制造一个元素。不要再考虑内联事件绑定，而要考虑正确的事件绑定。使用

addEventListener

谢谢！这似乎奏效了！