Я пытаюсь создать инструмент, который будет обновлять некоторые HTML, предоставленные пользователем в элементе формы textarea.Я хочу, чтобы пользователь предоставил хорошо отформатированную 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 и возвращайте его пользователю.