首頁猿問這個(gè)函數(shù)btnHandle()怎么理解？

這個(gè)函數(shù)btnHandle()怎么理解？

JavaScript

oldwan 2016-04-08 19:11:18

<!DOCTYPE><html>? <head>? ? <meta charset="utf-8">? ? <title>ief</title>? </head><body>? <ul id="source">? ? <li>北京空氣質(zhì)量：90</li>? ? <li>上?？諝赓|(zhì)量：70</li>? ? <li>天津空氣質(zhì)量：80</li>? ? <li>廣州空氣質(zhì)量：50</li>? ? <li>深圳空氣質(zhì)量：40</li>? ? <li>福州空氣質(zhì)量：32</li>? ? <li>成都空氣質(zhì)量：90</li>? </ul>? <ul id="resort">? ? ? </ul>? <button id="sort-btn">排序</button><script type="text/javascript">//通過元素匹配數(shù)組并提取其中需要的信息組成新的數(shù)組function getData(){? var data=[];? var source=document.getElementById("source");? var oli=source.getElementsByTagName("li");? for (var i = 0; i <oli.length; i++) {? data.push(oli[i].innerHTML.replace(/(.*)空氣質(zhì)量：([0-9]*)<\/b>/,'$1 $2').split(" "));? }? return data;}//將新數(shù)組data按照從大到小排序function sortAqiData(data) { return data.sort(function(a,b){ return b[1]-a[1] })}//將排序后的數(shù)組利用遍歷寫到指定位置function render(data) { var resort = document.getElementById('resort');? data.forEach(function(item, index,array) {? ? resort.innerHTML += '<li>第' + (index + 1) + '名：' + item[0] + '空氣質(zhì)量：' + '' + item[1] + '</li>';? }); }//定義onclick的屬性值 ? ？？？？？？？？？？？？？？？？？這個(gè)怎么理解？？？？？？？？？？？？？？？？？？？？function btnHandle() {? var aqiData = getData();? aqiData = sortAqiData(aqiData);? render(aqiData);}//給按鈕添加onclick屬性和值function init() { var btn=document.getElementById("sort-btn"); btn.setAttribute("onclick","btnHandle()");}init();</script></body></html>

查看完整描述

2 回答

oldwan

TA貢獻(xiàn)2條經(jīng)驗(yàn) 獲得超2個(gè)贊

??/**
???*?也可以寫成下面的樣子??
???*?getData();
???*?sortAqiData(getData());
???*?render(sortAqiData(getData()));
???*/

1 反對(duì) 回復(fù) 2016-06-11

_瀟瀟暮雨

TA貢獻(xiàn)646條經(jīng)驗(yàn) 獲得超225個(gè)贊

這個(gè)ife的任務(wù)吧？就是指定點(diǎn)擊的事件處理程序啊。

1 反對(duì) 回復(fù) 2016-04-09

oldwan
這幾個(gè)函數(shù)寫到一起了，分開寫是什么樣的，寫到一起有沒有什么規(guī)則？

回復(fù) 2016-04-11
_瀟瀟暮雨
js非常靈活。其實(shí)寫不寫在一起對(duì)于代碼的正確運(yùn)行沒有什么區(qū)別。但是不推薦在一個(gè)函數(shù)內(nèi)部處理大量的任務(wù)。最好將每一個(gè)單獨(dú)的任務(wù)抽象為一個(gè)函數(shù)，這樣便于維護(hù)也更容易看懂。

回復(fù) 2016-04-11