看了一下內容,整個函數(shù)是為了解析章節(jié),根據(jù)你的注釋和代碼,以下是個人的愚見:把功能點細分:解析部分:節(jié)點列表,知識點列表,的實現(xiàn),可以封裝成兩個函數(shù)比如parseSection,parseKonwPoint業(yè)務部分:單獨封裝成一個函數(shù),好像就顏色代碼風格(也算不上):推薦es6語法下面是我大致幫你整合的代碼,不過好像知識點列表有bug,你自己檢查一下urlletz_chapter,mui,col1,col2;letparseSection=({chapter})=>{letj_sectionHtml='';for(leti=0;ilet{url,name}=z_chapter[chapter].list[i];j_sectionHtml+=`${name}`;}col2.innerHTML=j_sectionHtml;//節(jié)列表};letparseKnowPoint=({chapter,section})=>{letz_knowPointHtml='';for(leti=0;ilet{url,name}=z_chapter[chapter].list[section].list[i];z_knowPointHtml+=`${name}`;}col1.innerHTML=z_knowPointHtml;//知識點列表}letchangeColors=({chapter,section})=>{//業(yè)務:點擊改變字體顏色mui.each(mui(".col3a"),(index,item)=>{item.className="";});document.querySelectorAll(".col3a")[chapter].className="font_yellowmui-active";//'章'添加新的class.document.querySelectorAll(".col2a")[section].className="font_yellowmui-active";//'節(jié)'添加新的class,因為每次點擊會重新渲染'節(jié)',所以無需對兄弟'節(jié)'removeClass}letparserChapter=(mui,option)=>{parserChapter(option);parseKnowPoint(option);changeColors(option);}