怎么使用js控制按价格排序

JavaScript06

怎么使用js控制按价格排序,第1张

建立两个数组,一个对应价格,另一个对应索引。

然后对第一个数组排序,每一次交换都对第二个数组做相同操作,完成后既得排序后的索引顺序。

然后可以使用DOM操作,将所有排序项拷贝到一个数组里,删除原来的所有排序项,再按排序后的索引顺序输出到原位置,即完成基于js的控制按价格排序,希望有帮助。

排序的话,如果是表格,看下面的例子:

<!DOCTYPE HTML>

<html>

<head>

<meta charset="UTF-8" />

<title>HelloWorld</title>

<style type="text/css">

table {

margin: 0 auto

border: 1px solid black

border-collapse: collapse

}

td {

border: 1px solid black

}

</style>

<script src="jquery-1.8.0.min.js"></script>

<script type="text/javascript">

window.onload = function ()

{

var table = document.getElementById ('table')

var tbody = table.tBodies[0]

var rows = tbody.rows

var cells = rows[0].cells

for ( var j = 0j <cells.lengthj++)

{

cells[j].onclick = function ()

{

var asc = this.asc = !!this.asc ? -this.asc : -1

var array = []

array.index = this.cellIndex

for ( var i = 1i <rows.lengthi++)

{

array.push (rows[i])

}

array.sort (function (a, b)

{

var n1 = a.cells[array.index].firstChild.nodeValue

var n2 = b.cells[array.index].firstChild.nodeValue

if (n1 >n2)

{

return asc

}

else if (n1 <n2)

{

return -asc

}

else

{

return 0

}

})

for ( var i = 0i <array.lengthi++)

{

tbody.appendChild (array[i])

}

}

}

}

</script>

</head>

<body style="text-align: center">

<table id="table">

<tr>

<td>编号</td>

<td>姓名</td>

</tr>

<tr>

<td>1</td>

<td>李勇</td>

</tr>

<tr>

<td>2</td>

<td>王博</td>

</tr>

<tr>

<td>3</td>

<td>刘海</td>

</tr>

<tr>

<td>4</td>

<td>陈锋</td>

</tr>

</table>

</body>

</html>