jQuery：获取html作为用户输入，更新它，并将更新的html返回给用户

Question

我正在尝试创建一个工具，用于更新用户在textarea表单元素中提供的一些html。我希望用户提供格式良好的html表，其中的行可能有类来表示奇数行或偶数行。我想删除任何现有的类并添加适当的奇数/偶数类。

表单元素：

<div id="rowform">
<p>Enter the table code you have here.  Click submit to have the even/odd class attributes updated.</p>
<form onsubmit="return updateRowClass()">
<textarea name="rowData" id="rowData" cols="100" rows="20"></textarea>
<br><br><input type="submit" value="Submit table code">
<form>
</div>

这是我尝试检索和操作文本的地方。这是行不通的，但我希望有人能理解我的目标：

function updateRowClass(){
var rowData = document.createElement("div");
rowData.innerHTML = ($("#rowData").val());
var trOdd = $("tr:odd" , rowData.innerHTML).removeClass().addClass("odd");
var trEven = $("tr:even" , rowData.innerHTML).removeClass().addClass("even");

return false;
}

我在研究中找不到的是如何从表单元素中的字符串创建DOM树，然后操纵构造的DOM树，并将其返回给用户。

Answer 1

据我所知，这就是你要找的东西：

rowData.innerHTML = ($("#rowData").val());

有了这个

$('#rowform').append($("#rowData").val());