題目
- 參考以下示例代碼，頁面加載后，將提供的空氣質量數據數組，按照某種邏輯（比如空氣質量大於60）進行過濾篩選，最后將符合條件的數據按照一定的格式要求顯示
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>IFE JavaScript Task 01</title>
</head>
<body>
<h3>污染城市列表</h3>
<ul id="aqi-list">
<!--
<li>第一名：福州（樣例），10</li>
<li>第二名：福州（樣例），10</li> -->
</ul>
<script type="text/javascript">
var aqiData = [
["北京", 90],
["上海", 50],
["福州", 10],
["廣州", 50],
["成都", 90],
["西安", 100]
];
(function () {
/*
在注釋下方編寫代碼
遍歷讀取aqiData中各個城市的數據
將空氣質量指數大於60的城市顯示到aqi-list的列表中
*/
})();
</script>
</body>
</html>
-
第一步用for循環獲取數據
-
將數字數據添加到一個新數組
-
篩選數據進行判斷
-
對新數組用sort()方法進行排序
-
將結果添加到html中
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>IFE JavaScript Task 01</title>
</head>
<body>
<h3>污染城市列表</h3>
<ul id="aqi-list">
<!--
<li>第一名：福州（樣例），10</li>
<li>第二名：福州（樣例），10</li> -->
</ul>
<script type="text/javascript">
var aqiData = [
["北京", 90],
["上海", 50],
["福州", 10],
["廣州", 50],
["成都", 90],
["西安", 100],
["重慶",80]
];
function sortNumber(a,b)
{
return b-a;
}
(function () {
var arr = new Array();
var ul = document.getElementById('aqi-list');
var str = '';
var n=0;
//用for循環獲取數據
for (var i = 0; i < aqiData.length; i++) {
//將數字數據添加到一個新數組
if(aqiData[i][1]>60) {
arr.push(aqiData[i][1]);
}
}
arr.sort(sortNumber);
for (var i = 0; i < arr.length; i++) {
n++;
str += '<li>第'+n+'名：'+aqiData[i][0]+'，'+arr[i]+'</li>';
ul.innerHTML= str;
}
})();
</script>
</body>
</html>
JS中的sort方法
sort() 方法用於對數組的元素進行排序。
arrayObject.sort(sortby)
返回值
對數組的引用。請注意，數組在原數組上進行排序，不生成副本。
說明
如果調用該方法時沒有使用參數，將按字母順序對數組中的元素進行排序，說得更精確點，是按照字符編碼的順序進行排序。要實現這一點，首先應把數組的元素都轉換成字符串（如有必要），以便進行比較。
如果想按照其他標准進行排序，就需要提供比較函數，該函數要比較兩個值，然后返回一個用於說明這兩個值的相對順序的數字。比較函數應該具有兩個參數 a 和 b，其返回值如下：
- 若 a 小於 b，在排序后的數組中 a 應該出現在 b 之前，則返回一個小於 0 的值。
- 若 a 等於 b，則返回 0。
- 若 a 大於 b，則返回一個大於 0 的值。
如果不使用函數，則按照字母表的順序排序
<script type="text/javascript">
var arr = new Array(6)
arr[0] = "10"
arr[1] = "5"
arr[2] = "40"
arr[3] = "25"
arr[4] = "1000"
arr[5] = "1"
document.write(arr + "<br />")//10,5,40,25,1000,1
document.write(arr.sort())//1,10,1000,25,40,5
</script>
如果需要對數字的大小排序就要創建一個函數
<script type="text/javascript">
function sortNumber(a,b)
{
return a - b
}
var arr = new Array(6)
arr[0] = "10"
arr[1] = "5"
arr[2] = "40"
arr[3] = "25"
arr[4] = "1000"
arr[5] = "1"
document.write(arr + "<br />")
document.write(arr.sort(sortNumber))
//10,5,40,25,1000,1
//1,5,10,25,40,1000
</script>