使用 javascript 创建 HTML 元素？

Question

所以这是我使用 DOM 的第一个任务，所以我仍在尝试找出很多东西，但我必须通过 javascript 动态创建元素，我已经设法完成了一些工作，但我的元素的放置通常不是在正确的位置，我不确定如何仅在 javascript 上将它们放置在指定的位置。我必须创建一个文本框，并且熊图像应该是用户的个人资料图片，我需要它有一个提交按钮和一个取消按钮。我在尝试使用 javascript 创建带有所需按钮的输入框时遇到问题。

我已经通过将一些 CSS 和元素直接添加到 HTML 中来打破规则，但这没什么大不了的。出于某种原因，该页面在加载 jsfiddle 时遇到了一些问题，但可以作为常规网页正常加载。 JSFiddle

var input = document.createElement("input");
input.type = 'text';
input.name = 'inputName';
input.value = 'some value';
input.size = 10;
input.maxLength = 10;
input.className = 'someClass';
var btn = document.getElementByID("goog")[0];
btn.parentElement.insertBefore(input, btn);

这不会生成按钮和文本框，我不太确定为什么。

How my current code looks How it should look

Answer 1

首先，你使用了错误的语法

getElementByID 应该是 getElementById

第二个问题，通过 id 获取元素总是返回一个元素。如果要获取第一个元素，则必须使用 getElementsByClassName 或 TagName。

您可以在所有 div 中将相同的 id 'goog' 定义为一个类，然后它将起作用