降序表以及JavaScript中的升序

时间:2016-02-01 20:21:54

标签: javascript html sorting

所以我创建了一个动态JavaScript表,它与HTML一起使用来创建Miles到KM转换器。我的表目前运行升序,但不确定如何使其运行降序,因为用户应该有选项。我非常确信这是for循环,但我想知道是否有人可以帮我解决这个问题。

function milesConverterAsc(tagId, from, to){

var first = document.getElementById("Input1");
var second = document.getElementById("Input2");
from = parseInt(first.value);
to = parseInt(second.value);
var conv = document.getElementById(tagId);
var tab = document.createElement("table");
var bod = document.createElement("tbody");
var thed = document.createElement("thead");
tab.appendChild(thed);
tab.appendChild(bod);
var tr = document.createElement("tr");
thed.appendChild(tr);
var th = document.createElement("th");
tr.appendChild(th);
th.appendChild(document.createTextNode("Miles"));
th = document.createElement("th");
tr.appendChild(th);
th.appendChild(document.createTextNode("Kilometers"));
conv.appendChild(tab);

for(var i=from; i<=to; i++){
    tr = document.createElement("tr");
    if (i <= -1){
        alert("Value must be positive Integer");
        return false;
    }
    else if (i % 2 == 0)
        tr.setAttribute("class", "even");
    else
        tr.setAttribute("class", "odd");
    bod.appendChild(tr);
    td = document.createElement("td");
    tr.appendChild(td);
    td.appendChild(document.createTextNode(i));
    td = document.createElement("td");
    tr.appendChild(td);
    td.appendChild(document.createTextNode(mtk(i)));
}
function mtk(m) {
    outputOne = ((m * 1.6093)*10)/10;
    outputTwo = outputOne.toFixed(2);
    return outputTwo
}

编辑:这是我用来获取输入的HTML代码。

<form action="">
<p> ASCENDING ORDER</p>
</br></br>
    <textarea rows="1" name="Input1" id="Input1" cols="10"></textarea>
    <textarea rows="1" name="Input2" id="Input2" cols="10"></textarea>

</form>

希望你能帮助我!这是升序代码。

1 个答案:

答案 0 :(得分:2)

您可以在for循环中创建表行。每一行都基于for循环的索引变量。现在它将始终按升序排列,假设从&lt;至。要使其反转它的顺序,只需将for循环设置切换为:

for(var i=to; i>=from; i--)

A simple codepen to demonstrate