//section information
The function chapter_info () {
Var couId=$(" body "). Attr (" couId ");
//the console. The log (cou);
$.get ("/home/getChapterinfo ", {couid: couid}, function (data) {
Var d=eval (" (" + data + ") ");
//the console log (d);
IsStudy=d.i sStudy;
//structure tree data structure
If (, dc hapter. Length & gt; 1) {
For (var I=0; i<, dc hapter. Length; I++) {
Var olisnode=, dc hapter [I] olisnode, olQuescount=, dc hapter [I] olQuescount, olisfinish=, dc hapter [I] olisfinish;


If (olisnode) {
If (isFirstNode) {
IsFirstNode=false;
} else {
ListData +='\ n},
}
ListData +="{\ n " name \ ": " "+, dc hapter [I] olName +" \ ", \ n ";
OlQuescount listData +="" \ ", \ "" + olQuescount +" \ ", \ n "+" \ "olisfinish ", \ "" + olisfinish +" \ ", \ n ";
ListData +="" \ ", \ "url" + "QuesExercises. Th? Olid="+, dc hapter [I] olid +" & amp; Couid couid="+ +" \ ", \ n ";

ListData +="" lists \ ":"
} else {
ListData +="{\ n " name \ ": " "+, dc hapter [I] olName +" \ ", \ n ";
OlQuescount listData +="" \ ", \ "" + olQuescount +" \ ", \ n "+" \ "olisfinish ", \ "" + olisfinish +" \ ", \ n ";
ListData +="" \ ", \ "url" + "QuesExercises. Th? Olid="+, dc hapter [I] olid +" & amp; Couid couid="+ +" \ ", \ n \ n} ";

}
}
ListData +="]}] "
} else {}
CreateTree ();

})
}

//to create section tree list
The function createList (listData) {
Const list=document. The createElement method (" ul ");
For (const data of listData) {
Const li=document. The createElement method (" li ");
Const a=document. The createElement method (' a ');
Const s=document. The createElement method (" span ");

If (data. Olisfinish=="false")
{
Anderson nnerText=data. The name;
//a.s etAttribute (' type ', 'nofinish');
//a.s etAttribute (' class ', 'noselect');

S.s etAttribute (' class ', 's - badge);
S.i nnerText='unfinished';
Li. The appendChild (s);

} else if (isStudy=="true" | | couIsfree | | couIslimitfree | | couIstry) {
Anderson nnerText=data. The name;
A.s etAttribute (' href 'data. The url);

Const s1=document. The createElement method (" span ");
S1. The setAttribute (' class ', 's - badge count');
Li. The appendChild (s1);

S.i nnerText=0;
S.s etAttribute (' class ', 'ansnum');
S1. The appendChild (s);

Const s2=document. The createElement method (" span ");
S2. The innerText='/' + data. OlQuescount;
S2. SetAttribute (' class ', 'num');

S1. The appendChild (s2);
}
The else {
//a.s etAttribute (' type ', "buy");
Data. The url="CourseBuy. Th? Couid="+ $(). GetPara (" couid");
A.s etAttribute (' href 'data. The url);
Anderson nnerText=data. The name;

S.s etAttribute (' class ', 's - badge);
S.i nnerText='buy';
Li. The appendChild (s);
}

Li. The appendChild (a);

Let hasChild=false;
If (data. Lists) {
HasChild=true;
Li. The appendChild (createList (data. Lists));
}
Li. SetAttribute (' class ', 'chapter + (! HasChild? 'and' : '));
Li. SetAttribute (' count 'data. OlQuescount);
List. The appendChild (li);
}
return list;
}
//section of the tree click event
The function createTree () {
Document. The getElementById (" Chapters "). The appendChild (createList (eval (listData)));
//querySelectorAll can look for the element internal matching conditions of all the elements, and only look for the element of querySelector inside the first condition of the matched elements
Document. QuerySelectorAll (' chapter ', ': : before'). The forEach (node=& gt; {
Node. The onclick=(event)=& gt; {
.//the event target is referring to the triggering event element source, localName used to obtain the triggering event element tag
The console. The log (event. Target. LocalName);
The switch (event. Target. LocalName) {
Case "ul" :
Const ulnode=node. QuerySelector (" ul ");
//the console. The log (ulnode);
//the setAttribute used to set the attribute of the element, and the display is style within the object attribute
Ulnode. Style. The display=(ulnode. Style. The display==""? "None" : "");
break;
A case of "li" :
Const ul=node. QuerySelector (" ul ");
//the console. The log (ul);
//the setAttribute used to set the attribute of the element, and the display is style within the object attribute
Ul. Style. The display=(ul. Style. The display==""? "None" : "");
break;
Case "a" :

//the preventDefault default behavior method is used to block elements (click on a tag will default to the anchor link)
//event. The preventDefault ();
//the console. The log (event. The view. The location. Href);
//return;
break;
}
//resulto passed due to the event (event bubbling), so you must call this method to prevent events continue to spread the
Event. StopPropagation ();
}
});
}