javascript查找修改表单数据的增量

我有一个通过python django呈现的html和javascript页面，其中每个页面中最多有30个条目的表单数据，可以编辑。我包含了一个隐藏字段，其中包含相同的表单数据，以提取表单中的旧值和修改值。我希望只提取增量（已更改字段的旧值和新值）。我的代码是

{%extends 'base.html'%}
{%block content%}
<h4> Search results</h4>
<p id="data"></p>
<style>
table, th, td {
    border: 1px solid black;
    border-collapse: collapse;
}
th, td {
    padding: 5px;
}
</style>

<script>
function onEdit(btn)
{
    var id=btn.id;
        var before = '';
        var after = '';
        var input = document.getElementsByName("new"+id);
    if(btn.value=="Edit") {
            //var input = document.getElementsByName("name"+id);
            for(i = 0;i < input.length; i++) {
            document.getElementById(input[i].id).removeAttribute("Readonly");
            } //End of for loop
            document.getElementById(id).value="Save";

            return false;
    }
    if(btn.value=="Save") {
        for(i = 0;i < input.length; i++) {
            document.getElementById(input[i].id).setAttribute("Readonly", "readonly");
            }
        document.getElementById(id).value="Edit";
        return false;
    }

} // End of Function onEdit()

{% autoescape off %}
var data = {{ search|safe }}; //search is the key defined in django view and will be substituted with the json value
{% endautoescape %}
text = ''
var out = '<form name="display" id="update" method="post" action="update/">';
out += "<table style=\"width:50%\">";
out +=    "<tr>";
out +=    "<th>Domain</th>";
out +=    "<th>Points to</th>";
out +=    "<th>Type</th>";
out +=    "<th>TTL</th>";
out +=    "<th>MX priority</th>";
out +=    "<th>Recorded generated on</th>";
out +=      "<th></th>";
out +=  "</tr>";
var i 
var id = 0;
for ( var i = 0; i < data.records.length; i++) {
id = id + 1;
out += "<tr><td>" +
"<input readonly='readonly' name='new" + id + "' id='" + data.records[i].domain + "' value='" + data.records[i].domain + "'type='text'/>" +
"<input type='hidden' name='old" + id + "' id='" + data.records[i].domain + "' value='" + data.records[i].domain + "'type='text'/>" +
"</td><td>" +
"<input readonly='readonly' name='new" + id + "' id='" + data.records[i].record_points_to + "' value='" + data.records[i].record_points_to +"'type='text'/>" +
"<input type='hidden' name='old" + id + "' id='" + data.records[i].record_points_to + "' value='" + data.records[i].record_points_to + "'type='text'/>" +
"</td><td>" +
data.records[i].record +
"</td><td>" +
"<input readonly='readonly' name='new" + id + "' id='" + data.records[i].ttl + "' value='" + data.records[i].ttl + "'type='text'/>" +
"<input type='hidden' name='old" + id + "' id='" + data.records[i].ttl + "' value='" + data.records[i].ttl + "'type='text'/>" +
"</td><td>" +
data.records[i].priority_mx +
"</td><td>" +
data.records[i].generated_on +
"</td><td>" +
"<input id='" + id + "' value='Edit' onclick='return onEdit(this)' type='button'/>" +
"</td></tr>";
}
out += "</table>"

total = data.meta.total_records
page = data.meta.page
records_returned = data.records.length
records_shown = ((data.meta.page - 1) * 30) + data.records.length

out += records_shown + " returned of " + total
page = data.meta.page + 1
link = window.location.href
out += "<input type='hidden' name='currenturl' value='" + link + "'>"
if (records_shown == total){
out += " End "
}
else{
url ="<a href='" + updateQueryStringParameter(link, "page", page) + "'> Next"

out += url
}
function updateQueryStringParameter(uri, key, value) {
  var re = new RegExp("([?&])" + key + "=.*?(&|$)", "i");
  var separator = uri.indexOf('?') !== -1 ? "&" : "?";
  if (uri.match(re)) {
    return uri.replace(re, '$1' + key + "=" + value + '$2');
  }
  else {
    return uri + separator + key + "=" + value;
  }
}
//out += '<input style="position: relative; left: 550px;" type="submit" value="Submit">';
out += '<br>'
out += '<button type="submit" class="btn btn-default">Submit</button>'
out += '</form>';
document.getElementById("data").innerHTML = out
</script>
{%endblock%}

{%extends'base.html%}
{%block content%}
搜索结果

表，th，td{
边框：1px纯黑；
边界塌陷：塌陷；
}
th，td{
填充物：5px；
}
功能OneEdit（btn）
{
var id=btn.id；
前风险值=“”；
var后=''；
var input=document.getElementsByName（“新”+id）；
如果（btn.value==“编辑”）{
//var input=document.getElementsByName（“名称”+id）；
对于（i=0；i

---

最好的方法是什么？

您看到了吗？Jquery，所以我必须包含它。好吧，warath-coder.django管理员无论如何都依赖jquery；我相信你可以用普通的javascript来完成，但在我看来，这需要更多的工作。