Javascript 在HTML表中定位

我有一个HTML表格，里面有一个提交按钮。现在，我在我的JavaScript文件中调用一个函数，该函数应该创建一个验证码，并将其放在我有提交按钮的表格中的HTML页面中

在JavaScript中，我正在执行一个

document.write（）

，并将JavaScript文件中的图像粘贴到HTML页面中。现在我希望这个图像和submit都在同一个表中，但是submit需要在HTML页面上，并且图像必须只在JavaScript文件中。不幸的是，图像粘贴在页面底部的某个位置。我不明白这种定位是如何运作的。尽管两个控件位于不同的文件中，但是否有任何解决方案可以将它们放在同一个表中

示例代码：

在HTML页面中：提交按钮位于表单标签中的表中

在JavaScript文件中：

document.write("img position=\"relative\" src=\"" + decodeURIComponent(imgdir) + imgid + ".jpg\" height=\"50\" width=\"100\" align=\"left\" style=\"margin-left: 4px;\" height=\"80\");
}

---

除了前面的评论之外，我强烈避免使用document.write，因为它很容易滥用HTML的语义。我建议始终使用innerHTML编写元素并动态填充它们。innerHTML不是标准，但它比使用DOM方法快2.5到3.5倍。我还强烈建议您验证动态生成的HTML，以发现JavaScript引入的缺陷。

您可以尝试在表中所需的位置定义HTML img标记，并以css样式将其隐藏，直到使用JavaScript设置源代码。您还需要在其上设置id，以便在javascript中获得访问权限

在表格中，您可以如下定义html表格单元格：

<td>
  <!-- Your submit button goes here... --> 
  <img id="imagePlaceholder" style="display:none;margin-left:4px;" height="50" width="100" align="left" /> 
</td>

document.write（）

在页面末尾追加HTML。您可能希望使用类似于

appendChild（）

的方法将图像插入到正确的表单元格中。例如：

var image = document.getElementById("imagePlaceholder");
image.src = decodeURIComponent(imgdir) + imgid + ".jpg" ;
image.style.display = "inline";  // Make the image tag visible

一些建议：

• 使用像这样的JavaScript库——这样的东西就变得微不足道了
• 将图像的样式从元素移开，放入
  元素或外部CSS文件中

---

关于样式：在本例中，左边距：4px对于此特定图像来说是特殊的，而不是所有图像的通用样式，因此将其取出并放置在样式标记或单独的css文件中可能会有些过分。但对于一般样式来说，这是一个有效的观点。@awe：也许有些过分，但我喜欢将样式与标记分开。

var img = document.createElement('img');
img.src = decodeURIComponent(imgdir) + '.jpg';
// set the rest of the attributes...
var imgTd = document.getElementsById('imgDestination');
imgTd.appendChild(img);