sort()

Sort() 排序

<div style="font-size: 20px ;"> JavaScript array.sort() 用來 陣列 元素排序，並回傳一個排序完成的新陣列，一般可以分為將 英文字母 或 單字排序 或 數字元素排列，sort 僅會將原本的陣列重新排序，不會另外產生一個新陣列，也就是說回傳的結果陣列就是原本的那個陣列。</div><br> <div id="S1" ></div> <table border="3" style="width:100%;font-size: 20px ; "> <tbody> <tr><td> ﹤script> <font color="red">順序 分別為 a,b<font color="black"><br /> var A1= ["45", "76", "22", "14", "89", "78"];<br /> A1.sort(function(<font color="red">a,b<font color="black">){<br /> var x = a.toLowerCase();<br /> var y = b.toLowerCase();<br /> return a == b ? 0 : (a>b ? 1 : -1);}) <br /> document.write(A1); <br /> ﹤/script> </td><td> <script> var A1= ["45", "76", "22", "14", "89", "78"]; A1.sort(function(a,b){ var x = a.toLowerCase(); var y = b.toLowerCase(); return a == b ? 0 : (a>b ? 1 : -1);}) document.write(A1); </script> </td></tr> <!-------------22222---------------------------------------------> <tr><td> ﹤script> <font color="red">逆序 分別為 b,a<font color="black"><br /> var A1= ["45", "76", "22", "14", "89", "78"];<br /> A1.sort(function(<font color="red">b,a<font color="black">){<br /> var x = a.toLowerCase();<br /> var y = b.toLowerCase();<br /> return a == b ? 0 : (a>b ? 1 : -1);}) <br /> document.write(A1); <br /> ﹤/script> </td><td> <script> var A1= ["45", "76", "22", "14", "89", "78"]; A1.sort(function(b,a){ var x = a.toLowerCase(); var y = b.toLowerCase(); return a == b ? 0 : (a>b ? 1 : -1);}) document.write(A1); </script> </td></tr> <!----------------3333333-------------------------------------> <div id="S1" ></div> <table border="3" style="width:100%;font-size: 20px ; "> <tbody> <tr><td> ﹤script> <font color="red">順序 分別為 a,b<font color="black"><br /> var A1= ["ss", "gg", "aa", "SS", "GG", "2","AA"];<br /> A1.sort(function(<font color="red">a,b<font color="black">){<br /> var x = a.toLowerCase();<br /> var y = b.toLowerCase();<br /> return a == b ? 0 : (a>b ? 1 : -1);}) <br /> document.write(A1); <br /> ﹤/script> </td><td> <script> var A1= ["ss", "gg", "aa", "SS", "GG", "2","AA"]; A1.sort(function(a,b){ var x = a.toLowerCase(); var y = b.toLowerCase(); return a == b ? 0 : (a>b ? 1 : -1);}) document.write(A1); </script> </td></tr> <!------------------------------------------------------------------------> <tr><td> ﹤script> <font color="red">逆序 分別為 b,a<font color="black"><br /> var A1= ["ss", "gg", "aa", "SS", "GG", "2","AA"];<br /> A1.sort(function(<font color="red">b,a<font color="black">){<br /> var x = a.toLowerCase();<br /> var y = b.toLowerCase();<br /> return a == b ? 0 : (a>b ? 1 : -1);}) <br /> document.write(A1); <br /> ﹤/script> </td><td> <script> var A1= ["ss", "gg", "aa", "SS", "GG", "2","AA"]; A1.sort(function(b,a){ var x = a.toLowerCase(); var y = b.toLowerCase(); return a == b ? 0 : (a>b ? 1 : -1);}) document.write(A1); </script> </td></tr> </tbody> </table>

00

<!-- InStock.sort(function(a, b) 順序 --> <!-- InStock.sort(function(b, a) 逆序 --> <div style="font-size: 20px ;"> <table style="font-size:20px;vertical-align:top;"><tbody><tr> <td rowspan="8" style="vertical-align:top;">var Vehicles = [ </td> <td>{Qty:12 , </td><td> Brand:"orange"</td><td> , price:3.8},</td></tr> <td>{Qty:03 , </td><td> Brand:"pear"</td><td> , price:2.6},</td></tr> <td>{Qty:05 , </td><td> Brand:"apple"</td><td> , price:7.2},</td></tr> <td>{Qty:53 , </td><td> Brand:"banana"</td><td> , price:11.5},</td></tr> <td>{Qty:12 , </td><td> Brand:"lemon"</td><td> , price:1.1},</td></tr> <td>{Qty:53 , </td><td> Brand:"cherry"</td><td> , price:5.6},</td></tr> <td>{Qty:47 , </td><td> Brand:"lychee"</td><td> , price:3.2} ];</td></tr> </tbody></table> <br> <div id="DP1"></div> <br> <div id="DP2"></div> <br> <div id="DP3"></div> </div> <script> var Vehicles = [ {Qty:12, Brand:"orange", price:3.8}, {Qty:03, Brand:"pear", price:2.6}, {Qty:05, Brand:"apple", price:7.2}, {Qty:53, Brand:"banana", price:11.5}, {Qty:12, Brand:"lemon", price:1.1}, {Qty:53, Brand:"cherry", price:5.6}, {Qty:47, Brand:"lychee", price:3.2} ]; //******************* sort by Qty*************************// Vehicles = Vehicles.sort(function (a, b) { return a.Qty > b.Qty ? 1 : -1; }); var Tt ="<table border='1' style='width:100%;font-size:20px;'>"; Tt+="<tr><td rowspan='8'>" ; Tt+="<b><i>sort by Qty </b></i><br><br>" ; Tt+="Vehicles = Vehicles.sort(function (a, b) { <br>" ; Tt+= "return " ; Tt+= "<font color='red'>a.Qty > b.Qty<font color='black'> ? 1 : -1; });" ; Tt+="</td><th>Qty</th><th>Brand</th><th>price</th></tr>" ; for (var i = 0, l = Vehicles.length; i < l; ++i) { Tt += "<tr><td bgcolor='red'>" + Vehicles[i].Qty; Tt += "</td><td>" + Vehicles[i].Brand ; Tt += "</td><td>" + Vehicles[i].price ; Tt += "</td></tr></tablr>" } DP1.innerHTML = Tt ; //******************* sort by Brand ***********************// Vehicles = Vehicles.sort(function (a, b) { return a.Brand > b.Brand? 1 : -1; }); var Tt ="<table border='1' style='width:100%;font-size:20px;'>"; Tt+="<tr><td rowspan='8'>" ; Tt+="<b><i>sort by Brand </i><b><br><br>" ; Tt+="Vehicles = Vehicles.sort(function (a, b) { <br>" ; Tt+= "return " ; Tt+= "<font color='red'>a.Brand > b.Brand <font color='black'> ? 1 : -1; });" ; Tt+="</td><th>Qty</th><th>Brand</th><th>price</th></tr>" ; for (var i = 0, l = Vehicles.length; i < l; ++i) { Tt += "<tr><td >" + Vehicles[i].Qty; Tt += "</td><td bgcolor='red'>" + Vehicles[i].Brand ; Tt += "</td><td>" + Vehicles[i].price ; Tt += "</td></tr></tablr>" } DP2.innerHTML = Tt ; //******************* sort by price***********************// Vehicles = Vehicles.sort(function (a, b) { return a.price> b.price ? 1 : -1; }); var Tt ="<table border='1' style='width:100%;font-size:20px;'>"; Tt+="<tr><td rowspan='8'>" ; Tt+="<b><i>sort by price</i><b><br><br>" ; Tt+="Vehicles = Vehicles.sort(function (a, b) { <br>" ; Tt+= "return " ; Tt+= "<font color='red'>a.price > b.price<font color='black'> ? 1 : -1; });" ; Tt+="</td><th>Qty</th><th>Brand</th><th>price</th></tr>" ; for (var i = 0, l = Vehicles.length; i < l; ++i) { Tt += "<tr><td >" + Vehicles[i].Qty; Tt += "</td><td>" + Vehicles[i].Brand ; Tt += "</td><td bgcolor='red'>" + Vehicles[i].price ; Tt += "</td></tr></tablr>" } DP3.innerHTML = Tt ; </script>

00

<div id="myDiv"></div> <div id="DP" ></div> <button type="button" onclick="Sv()" >sort by value</button> <button type="button" onclick="St()" >sort by text</button> <script> var myDiv = document.getElementById("myDiv"); var array = [{"value":"44","text":"CC"},{"value":"22","text":"AA"},{"value":"33","text":"DD"},{"value":"11","text":"BB"}]; var myDiv = document.getElementById("myDiv"); var Sel = document.createElement("select"); function Sv() { Vehicles = array .sort(function (a, b) { return a.value> b.value? 1 : -1; }); JtoSel(); } function St() { Vehicles = array .sort(function (a,b) { return a.text> b.text? 1 : -1; }); JtoSel(); } function JtoSel() { Sel .setAttribute("id", "mySelect"); for (var i = array.length; i > -1 ; i--) { Sel .remove(i); } for (var i = 0; i < array.length; i++) { var options = document.createElement("option"); // options.setAttribute("value", array[i]); options.text = array[i].text; options.value= array[i].value; Sel .appendChild(options) ; } myDiv.appendChild(Sel ); DPSel(); } JtoSel(); function DPSel() { var txt = '﹤select id="' + Sel.id + ' "><br>' ; for (var i = 0; i < Sel.options.length ; i++) { txt += '﹤options value="' + Sel.options[i].value ; txt += '" > ' + Sel.options[i].text + ' ﹤/options><br>' ; } txt += '﹤/select>' DP.innerHTML = txt ; } DPSel(); </script>

00

#html 陣列排序 sort(), #script 陣列排序 sort(),