使用javascript动态创建元素

因此，我使用javascript在html中创建了元素。唯一的问题是我的按钮没有显示。以下是我的代码：

var search_div1 = document.createElement("div");
search_div1.className = "input-group row-fluid";

var search_div2 = document.createElement("div");
search_div2.className = "span4 offset4";

var search_input = document.createElement("input");
search_input.className = "form-control offset8";
search_input.id = "searchText";
search_input.type = "text";
search_input.placeholder = "Search...";
search_input.style.width = "200px";
search_input.style.marginLeft = "550px";

var search_span = document.createElement("span");
search_span.className = "input-group-btn";
search_span.width = "50px";

var search_button = document.createElement("button");
search_button.type = "submit";
search_button.id = "search";
search_button.name = "search";
search_button.className = "btn btn-flat";
search_button.onclick = myFunction;

var search_icon = document.createElement("i");
search_icon.className = "fa fa-search";

search_button.appendChild(search_icon);
search_span.appendChild(search_button);
search_input.appendChild(search_span);
search_div2.appendChild(search_input);
search_div1.appendChild(search_div2);

---

除了search_按钮之外，其他所有的东西都显示得非常完美，我已经创建了这样的按钮，可以完美地工作。有人能帮我吗？提前感谢。

您使用的

.appendChild（）

不正确。例如，这行代码：

search_input.appendChild(search_span);

正在尝试使

成为

的子对象。这是不合法的

记住

x.appendChild（y）

使

y

成为DOM层次结构中

x

的子级

---

我们无法真正建议正确的追加顺序是什么，因为我们不知道您想要得到什么HTML结构。如果完成后向我们展示您希望DOM层次结构的外观，我们可以使用适当的代码来帮助您实现这一点。

您是否在任何内容中添加了

search\u div1

？是的。正如我所说的，所有内容都是可见的，即使我在浏览器中“检查元素”，Html代码也会显示正在创建的按钮，但它仍然不可见。请发布您的其余代码，以便我们可以看到实际情况。您是对的。我没看到。老实说，这肯定是我犯过的最愚蠢的错误。谢谢你的帮助。