如何从 DOM 中获取 Html 以及输入数据

Question

我正在编写一个 Web 应用程序，我必须从 DOM 发送 HTML 以及相应文本区域和文本框的值。目前，我正在使用 innerHTML 来完成此操作。

假设我们有一个 html 脚本

<div id="abcd">
   <form id="form1" >
      <input type="text" id="input1" />
   </form>
</div>

现在，在浏览器的 html 页面上，我用一些值填充文本框（比如 - “12345”）。 而且，我尝试使用

捕获完整的 html

var x = $("#abcd").html();  // or 
var x = document.getElementById("abcd").innerHTML ;

我在 x 中得到的只是

<div id="abcd">
   <form id="form1" >
      <input type="text" id="input1" />
   </form>
</div>

虽然我想要类似的东西 -

<div id="abcd">
   <form id="form1" >
      <input type="text" id="input1" value="abcd" />
   </form>
</div>

Answer 1

您使用了错误的选择器来获取文本输入区域。尝试使用“#input1”。像这样获取您的文本区域值

var x = $("#input1").val();

这将捕获用户输入的文本。 然后使用变量 x 创建完整的 HTML

var y = '<div id="abcd"><form id="form1" ><input type="text" id="input1" value=' + x + "/>   </form></div>"

这是小提琴http://jsfiddle.net/qMcJ9/ PS。我不知道您使用的是什么事件，所以我将它连接到 .keyup 事件，您可以随意更改它